@splunk/visualizations 28.6.0 → 28.7.0

package/docs-llm/single-value-radial/options.md

@@ -0,0 +1,41 @@
+# Single Value Radial Visualization Options
+
+**Component Reference:** Single Value Radial or @splunk/visualizations/singleValueRadial
+
+Source: `@splunk/visualization-schemas/singleValueRadialOptionsSchema`
+
+| Option | Type | Default | Description |
+| --- | --- | --- | --- |
+| `backgroundColor` | string \| string | `> themes.defaultBackgroundColor` | Specify the color for the background. The hex value format should be “#ffffff”. The default for enterprise light is "#ffffff". The default for enterprise dark is "#000000". The default for prisma dark is "#0b0c0e". |
+| `gaugeRanges` | array<object> \| string | `> majorColorEditorConfig` | Specify the overall range of the gauge as a series of continuous, color-coded subranges. For example, [{"to": 20, "value": "#4BEBA8"}, {"from": 20, "to": 50, "value": "#D41F1F"}, {"from": 50, "value": "#F4DF7A"}]. Must be unbounded, open ranges. Ranges are bound by a separate minValue/maxValue option. Only configured if isGaugeOn is true. |
+| `isGaugeOn` | boolean \| string | `false` | Specify if gauge is on. |
+| `majorColor` | string \| string | `> themes.defaultFontColor` | Specify the color for the major value. You may use a dataSource to apply the color. The hex value format should be “#ffffff”. The default for enterprise light is "#000000". The default for enterprise dark is "#ffffff". The default for prisma dark is "rgba(255, 255, 255, 0.98)". |
+| `majorValue` | string \| number \| string | `> primary \| seriesByPrioritizedTypes("number", "string", "time") \| lastPoint()` | The raw value to display and used to calculate trendValue. It is not displayed if majorValueDisplay is specified. |
+| `majorValueDisplay` | string \| number \| string | `> majorValue` | The formatted version of majorValue displayed in the visualization. |
+| `majorValueField` | string \| string | `> majorValue \| getField()` | Specify the field that should be mapped to the major value. |
+| `maxValue` | number \| string | `100` | Specify the value the radial fills up to. |
+| `minValue` | number \| string | `0` | Specify the min value of the radial. |
+| `numberPrecision` | number \| string | `0` | Specify the number of decimal places to display. For example, to display 3 decimal places, use a value of 3. Values can range from 0 to 20. |
+| `radialBackgroundColor` | string \| string | `> themes.defaultRadialBackgroundColor` | Specify the color for the radial background. The hex value format should be “#ffffff”. The default for enterprise light is "rgba(0, 0, 0, 0.1)". The default for enterprise dark is "rgba(255, 255, 255, 0.15)". The default for prisma dark is "rgba(255, 255, 255, 0.15)". |
+| `radialStrokeColor` | string \| string | `> majorColor` | Specify the color for the radial. You may use a dataSource to apply the color. The hex value format should be “#ffffff”. The default for enterprise light is "#000000". The default for enterprise dark is "#ffffff". The default for prisma dark is "rgba(255, 255, 255, 0.98)". |
+| `shouldAbbreviateMajorValue` | boolean \| string | `false` | Specify whether to abbreviate the major value to 2 decimal points. A magnitude unit will be displayed. |
+| `shouldAbbreviateTrendValue` | boolean \| string | `false` | Specify whether to abbreviate the trend value to 2 decimal points. A magnitude unit will be displayed. |
+| `shouldUseThousandSeparators` | boolean \| string | `true` | Specify whether numeric values use commas as thousandths separators. |
+| `splitByLayout` | string \| string | `off` | Specify the layout method by which to display the visualization, which splits the data into individual visualizations based on a certain category. |
+| `trellisBackgroundColor` | string \| string | `> themes.defaultBackgroundColor` | Specify the color used for the trellis container background by using a hexadecimal code. For example, #0000FF. |
+| `trellisColumns` | number \| string | — | Specify the number of visualizations to display in a given row of the trellis container. The remaining visualizations will wrap accordingly. If nothing is specified, it will be auto-set based on the trellisMinColumnWidth. The minimum value is 1. |
+| `trellisMinColumnWidth` | number \| string | `120` | Specify the minimum width, in pixels, of each visualization in the trellis container. If the window or panel is resized, the remaining visualizations may be viewed by scrolling. The minimum value is 1. |
+| `trellisPageCount` | number \| string | `20` | Specify the maximum number of visualizations to display in a single page in the trellis container. The remaining visualizations will paginate accordingly. The minimum value is 1. |
+| `trellisRowHeight` | number \| string | `100` | Specify the height, in pixels, of each visualization in the trellis container. If the window or panel is resized, the remaining visualizations may be viewed by scrolling. The minimum value is 1. |
+| `trellisSortBy` | string \| string | `result` | Specify the sort method for the individual visualizations in the trellis container. Use result to sort by search result order, name to sort alphabetically by visualization label, value to sort by the major value, or trend to sort by the trend value. |
+| `trellisSortOrder` | string \| string | `ascending` | Specify the sort order for the individual visualizations in the trellis container. This setting applies to the sort method specified in trellisSortBy. |
+| `trellisSplitBy` | string \| string | — | Specify the field name of the column with categories used, or “aggregations”, to split the data into individual visualizations for trellis display, if applicable. If a SPL `timechart` command is used, this may default to the SPL `by` clause field. If a SPL `chart` command is used, this may default to the first string field. |
+| `trendColor` | string \| string | `> themes.defaultFontColor` | Specify the color for the trend value. You may use a dataSource to apply the color. The hex value format should be “#FFFFFF”. The default for enterprise light is "#000000". The default for enterprise dark is "#ffffff". The default for prisma dark is "rgba(255, 255, 255, 0.98)". |
+| `trendDisplay` | string \| string | `absolute` | Specify how to display the trend value. |
+| `trendValue` | number \| string | `> primary \| seriesByPrioritizedTypes("number", "string", "time") \| delta(-2)` | Specify the dataSource applied to the trend value. |
+| `underLabel` | string \| string | — | Specify the text that appears below the major value. |
+| `underLabelColor` | string \| string | `> majorColor` | Specify the color for the under label text. You may use a dataSource to apply the color. The hex value format should be “#FFFFFF”. By default it follows the major value color. |
+| `unit` | string \| string | — | Specify text to show next to the major value. |
+| `unitPosition` | string \| string | `after` | Specify whether the unit text should appear before or after the major value. |
+
+_Auto-generated; do not edit by hand._

package/docs-llm/single-value-radial/overview.md

@@ -0,0 +1,5 @@
+# Single Value Radial Visualization Guide
+
+**Component Reference:** Single Value Radial or @splunk/visualizations/SingleValueRadial
+
+_Overview content not available for this visualization._

package/docs-llm/table/examples-json.md

@@ -0,0 +1,5 @@
+# Table Examples
+
+**Visualization Reference:** splunk.table
+
+_No code examples available for this visualization._

package/docs-llm/table/examples-react.md

@@ -0,0 +1,5 @@
+# Table Examples
+
+**Component Reference:** Table or @splunk/visualizations/Table
+
+_No code examples available for this visualization._

package/docs-llm/table/options.md

@@ -0,0 +1,25 @@
+# Table Visualization Options
+
+**Component Reference:** Table or @splunk/visualizations/table
+
+Source: `@splunk/visualization-schemas/tableOptionsSchema`
+
+| Option | Type | Default | Description |
+| --- | --- | --- | --- |
+| `backgroundColor` | string \| string | `> themes.defaultBackgroundColor` | Specify the color for the background. You might use a data source to apply the color. The default for enterprise light is "#FFFFFF". The default for enterprise dark is "#000000". The default for prisma dark is "#0B0C0E". |
+| `columnFormat` | object | — | Lets you format an individual column in a table. Specify a column in a table as a field, followed by a property. For more information, see the Column Format Align - Left example on the Examples page. |
+| `count` | number \| string | `10` | Specify the maximum number of rows to display. |
+| `font` | string \| string | `proportional` | Specify the font style to use for table content. |
+| `fontSize` | string \| string | `default` | Specify the font size to use for table content. Font sizes range from extra small (10px) to large (16px) with the default being 14px. |
+| `headers` | array<string> \| string | `> table \| getField()` | Specify an array of headers to display on the table. Though these can be statically listed, it's best to use the dynamic default, as it will return the fields of your search. |
+| `headerVisibility` | string \| string | `inline` | Specify how to display the table header row. |
+| `paginateDataSourceKey` | string \| string | `primary` | Specify the data source key for pagination and sorting. |
+| `showColumnAsExpandedJson` | string \| array<string> \| string | — | Specify row expansion content as stringified JSON. Provide either a DSL expression that resolves to an array of stringified JSON values, or a static array of stringified JSON values. Each item is rendered in the matching expanded row with JSONTree. |
+| `showFooterPercentages` | boolean \| string | `false` | Specify whether to show a row at the bottom of the table that displays percentage values for applicable columns. |
+| `showFooterTotals` | boolean \| string | `false` | Specify whether to show a row at the bottom of the table that displays total values for applicable columns. |
+| `showInternalFields` | boolean \| string | `true` | Specify whether to show internal fields that start with an underscore. The _time field will still be shown if false. |
+| `showRowNumbers` | boolean \| string | `false` | Show row numbers in the first column. |
+| `table` | array<array<string \| number \| array<string \| number>>> \| string | `> primary` | Two dimensional array of data to be displayed in the table. |
+| `tableFormat` | object | — | Lets you set global options for a table. |
+
+_Auto-generated; do not edit by hand._

package/docs-llm/table/overview.md

@@ -0,0 +1,24 @@
+# Table Visualization Guide
+
+**Component Reference:** Table or @splunk/visualizations/Table
+
+## Overview
+
+A table is used to display values across a dataset simply and is especially useful with qualitative data.
+
+## Details
+
+- **Visualization Type:** splunk.table
+
+## Tips
+
+- Consider using color or sparkline formatting to communicate cell values.
+
+## Variations
+
+| Variation | Description | Key |
+| --- | --- | --- |
+| Table Formatting & Alignment | You may apply formatting to the whole table. For example, set a background color, header color, fixed header, number and time formatting. Any numbro.js library option can be used. | tableFormattingAlignment |
+| Column Formatting & Alignment | You may apply formatting to specific columns. For example, set alignment and column width. | columnFormattingAlignment |
+| Column Coloring By Gradient | Dynamically color table cells to highlight specific data points. For example, use gradient formatting to locate higher values in a column. | columnColorByGradient |
+| Sparkline Formatting | Set cell types for different columns to display string or sparkline data. Customize sparklines with a type and style. | sparklineFormatting |

package/docs-llm/timeline/examples-json.md

@@ -0,0 +1,5 @@
+# Timeline Examples
+
+**Visualization Reference:** splunk.timeline
+
+_No code examples available for this visualization._

package/docs-llm/timeline/examples-react.md

@@ -0,0 +1,5 @@
+# Timeline Examples
+
+**Component Reference:** Timeline or @splunk/visualizations/Timeline
+
+_No code examples available for this visualization._

package/docs-llm/timeline/options.md

@@ -0,0 +1,27 @@
+# Timeline Visualization Options
+
+**Component Reference:** Timeline or @splunk/visualizations/timeline
+
+Source: `@splunk/visualization-schemas/timelineOptionsSchema`
+
+| Option | Type | Default | Description |
+| --- | --- | --- | --- |
+| `additionalTooltipFields` | array<string> \| string | `[]` | Specify the fields to add to the default set of tooltips. Tooltips appear when you hover over events. These fields and their corresponding values are shown in addition to the ones displayed by default. |
+| `backgroundColor` | string \| string | `> themes.defaultBackgroundColor` | Specify the color for the background. You may use a data source to apply the color. The default for enterprise light is "#ffffff". The default for enterprise dark is "#000000". The default for prisma dark is "#0b0c0e". |
+| `category` | array<string \| number> \| string | `> primary\| seriesByName("category")` | Specify the data source to apply series categories. This will color events in distinct categories. |
+| `categoryField` | string \| string | `> category \| getField()` | Specify the field that should be mapped to the y-axis. |
+| `dataColors` | string \| array<string> \| string | — | Specify the colors to use for events. You can use an array of colors to be picked from, or you can use a data source to apply dynamic coloring. For example, “> primary \| seriesByName("count") \| rangeValue(lowToHigh)”. By default, the dataColors option is not defined and seriesColors is used for categorical coloring. |
+| `duration` | array<string \| number> \| string | `> primary \| seriesByPrioritizedTypes("number", "time")` | Specify the data source to apply duration to events. This will display events over a length of time as a bar rather than a circle. |
+| `durationField` | string \| string | `> duration \| getField()` | Specify the field that should be mapped to the x-axis. |
+| `durationUnit` | string \| string | `milliseconds` | Specify the unit of the values in the duration data source used to apply duration to events. |
+| `legendDisplay` | string \| string | `off` | Specify the location of the legend on the panel. |
+| `legendTruncation` | string \| string | `ellipsisEnd` | Specify how to display legend labels when they overflow the layout boundaries by replacing overflow text with an ellipsis. |
+| `resultLimit` | number \| string | `10000` | Specify the maximum number of events to render on the timeline. Adjust the value to improve performance. |
+| `seriesColors` | array<string> \| string | `["#7B56DB","#009CEB","#00CDAF","#DD9900","#FF677B","#CB2196","#813193","#0051B5","#008C80","#99B100","#FFA476","#FF6ACE","#AE8CFF","#00689D","#00490A","#465D00","#9D6300","#F6540B","#FF969E","#E47BFE"]` | Specify the colors used for a series. For example, ["#FF0000", "#0000FF", "#008000"]. |
+| `x` | array<string \| number> \| string | `> primary \| seriesByType("time")` | Specify the data source applied to the x-axis. |
+| `xField` | string \| string | `> x \| getField()` | Specify the field that should be mapped to the x-axis. |
+| `y` | array<string \| number> \| string | `> primary \| seriesByPrioritizedTypes("string", "number")` | Specify the data source applied to the y-axis. |
+| `yAxisLabelWidth` | number \| string | `100` | Specify the width, in pixels, for y-axis labels. |
+| `yField` | string \| string | `> y \| getField()` | Specify the field that should be mapped to the y-axis. |
+
+_Auto-generated; do not edit by hand._

package/docs-llm/timeline/overview.md

@@ -0,0 +1,24 @@
+# Timeline Visualization Guide
+
+**Component Reference:** Timeline or @splunk/visualizations/Timeline
+
+## Overview
+
+A timeline visualization displays activity intervals and events over time for a set of resources. Each resource is represented in a separate lane, where intervals with a defined start time and duration appear as horizontal bars, while discrete events with only a start time are shown as circles.
+
+## Details
+
+- **Visualization Type:** splunk.timeline
+
+## Tips
+
+- Use timelines to visualize sequences of events or overlapping activities.
+- Ensure consistent time scaling to maintain accuracy and readability.
+- Best for tracking resource utilization, project timelines, or event patterns over time.
+
+## Variations
+
+| Variation | Description | Key |
+| --- | --- | --- |
+| Single Series | Use a single series timeline to display activity intervals or events for a single category of data over time. | single |
+| Multi Series | Use a multi series timeline to compare overlapping activities or different event types for multiple resources over time. | multi |

package/package.json

@@ -2,9 +2,9 @@
   "name": "@splunk/visualizations",
   "license": "Apache-2.0",
   "author": "Splunk Inc.",
-  "version": "28.6.0",
+  "version": "28.7.0",
   "scripts": {
-    "build": "viz-build",
+    "build": "viz-build && yarn generate:llm-docs",
     "build-storybook": "sb build -c .storybook -o .storybook-bundle",
     "build:ci": "yarn build && yarn docs",
     "clean": "yarn clean:storybook && yarn clean:esbuild && yarn clean:test-reports",
@@ -20,6 +20,7 @@
     "docs:start": "export NODE_OPTIONS=--openssl-legacy-provider && INTERNAL=true webpack serve --config webpack.docs.config.js  --open",
     "docs:start:external": "INTERNAL=false webpack-dev-server --watch --config webpack.docs.config.js",
     "generate:iconloader": "node ./tools/generate_icon_loader.mjs",
+    "generate:llm-docs": "tsc -p ./tools/llm-docs/tsconfig.json && node ./tools/llm-docs/dist/generateContent.js",
     "lint": "eslint src --ext \".js,.jsx,.es,.ts,.tsx\"",
     "lint:ci": "eslint src --ext \".js,.jsx,.ts,.tsx\" -f junit -o test-reports/lint-results.xml",
     "lint:fix": "yarn run lint --fix",
@@ -39,24 +40,24 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.29.2",
-    "@splunk/async-dynamic-options-evaluator": "^28.6.0",
-    "@splunk/charting-bundle": "^28.6.0",
+    "@splunk/async-dynamic-options-evaluator": "^28.7.0",
+    "@splunk/charting-bundle": "^28.7.0",
     "@splunk/moment": "^0.7.0",
-    "@splunk/react-events-viewer": "^28.6.0",
-    "@splunk/react-field-summary": "^28.6.0",
-    "@splunk/react-icons": "^5.9.0",
-    "@splunk/react-ui": "^5.9.0",
+    "@splunk/react-events-viewer": "^28.7.0",
+    "@splunk/react-field-summary": "^28.7.0",
+    "@splunk/react-icons": "^5.11.0",
+    "@splunk/react-ui": "^5.10.0",
     "@splunk/splunk-utils": "^3.4.0",
-    "@splunk/themes": "^1.7.0",
+    "@splunk/themes": "^1.7.2",
     "@splunk/time-range-utils": "^3.4.1",
-    "@splunk/ui-utils": "^1.12.0",
-    "@splunk/visualization-canvas": "^28.6.0",
-    "@splunk/visualization-color-palettes": "^28.6.0",
-    "@splunk/visualization-encoding": "^28.6.0",
-    "@splunk/visualization-icons": "^28.6.0",
-    "@splunk/visualization-schemas": "^28.6.0",
-    "@splunk/visualization-themes": "^28.6.0",
-    "@splunk/visualizations-shared": "^28.6.0",
+    "@splunk/ui-utils": "^1.14.0",
+    "@splunk/visualization-canvas": "^28.7.0",
+    "@splunk/visualization-color-palettes": "^28.7.0",
+    "@splunk/visualization-encoding": "^28.7.0",
+    "@splunk/visualization-icons": "^28.7.0",
+    "@splunk/visualization-schemas": "^28.7.0",
+    "@splunk/visualization-themes": "^28.7.0",
+    "@splunk/visualizations-shared": "^28.7.0",
     "@xmldom/xmldom": "^0.8.13",
     "chroma-js": "^3.2.0",
     "cssesc": "3.0.0",
@@ -73,9 +74,9 @@
     "d3-transition": "^2.0.0",
     "d3-zoom": "^2.0.0",
     "dagre": "^0.8.5",
-    "dompurify": "^3.4.0",
+    "dompurify": "^3.4.2",
     "jexl": "^2.3.0",
-    "lodash": "^4.17.23",
+    "lodash": "^4.18.1",
     "maplibre-gl": "^5.8.0",
     "prop-types": "^15.8.1",
     "slate": "^0.112.0",
@@ -86,7 +87,7 @@
     "xpath": "^0.0.32"
   },
   "peerDependencies": {
-    "@splunk/visualization-context": "^28.6.0",
+    "@splunk/visualization-context": "^28.7.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "styled-components": "^5.3.10"
@@ -94,16 +95,19 @@
   "devDependencies": {
     "@babel/cli": "^7.26.4",
     "@babel/core": "^7.26.4",
+    "@babel/parser": "^7.29.3",
+    "@babel/traverse": "^7.29.0",
+    "@babel/types": "^7.29.0",
     "@loki/create-async-callback": "^0.35.1",
     "@mdx-js/loader": "^3.1.1",
     "@mdx-js/mdx": "^3.1.1",
     "@splunk/babel-preset": "^4.0.0",
     "@splunk/docs-gen": "^1.2.0",
-    "@splunk/dynamic-editors": "0.44.1",
+    "@splunk/dynamic-editors": "0.44.3",
     "@splunk/jsdoc-loader": "^3.1.1",
-    "@splunk/react-docs": "^1.6.0",
-    "@splunk/visualization-build-tools": "^28.6.0",
-    "@splunk/visualization-context": "^28.6.0",
+    "@splunk/react-docs": "^1.7.0",
+    "@splunk/visualization-build-tools": "^28.7.0",
+    "@splunk/visualization-context": "^28.7.0",
     "@splunk/webpack-configs": "^7.0.2",
     "@storybook/addon-actions": "^7.6.21",
     "@storybook/addon-docs": "^7.6.21",