@patternfly/patternfly 6.2.0-prerelease.2 → 6.2.0-prerelease.4

package/docs/utilities/BackgroundColor/examples/BackgroundColor.md

@@ -28,7 +28,7 @@ Care should be taken especially when applying background colors, as this can hav
 
 Note that "inverse" background colors are labeled as such to indicate that they are best used with the ["inverse" text colors](/utility-classes/text#inverse-colors).
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-v6-u-background-color-disabled-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-background-color-disabled-on-lg`
 
 ### Usage
 

package/docs/utilities/Display/examples/Display.md

@@ -83,7 +83,7 @@ section: utility-classes
 
 ### Overview
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-v6-u-display-inline-block-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-display-inline-block-on-lg`
 
 ### Usage
 

package/docs/utilities/Flex/examples/Flex.md

@@ -370,7 +370,7 @@ section: utility-classes
 
 ### Overview
 
-For these utilities to have effect, the parent element must be set to `display: flex` or `display: inline-flex`. [Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-v6-u-flex-row-on-lg**
+For these utilities to have effect, the parent element must be set to `display: flex` or `display: inline-flex`. [Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-flex-row-on-lg`
 
 <!-- ## Accessibility
 

package/docs/utilities/Float/examples/Float.md

@@ -18,7 +18,7 @@ section: utility-classes
 
 ### Overview
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-v6-u-float-inline-start-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-float-inline-start-on-lg`
 
 ### Usage
 

package/docs/utilities/Sizing/examples/Sizing.md

@@ -22,7 +22,7 @@ section: utility-classes
 
 ### Usage
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-v6-u-w-initial-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-w-initial-on-lg`
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
@@ -50,7 +50,7 @@ section: utility-classes
 
 ### Usage
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), -on-sm, -on-md, -on-lg, -on-xl. **Example .pf-v6-u-w-25vw-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-w-25vw-on-lg`
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
@@ -90,7 +90,7 @@ section: utility-classes
 
 ### Usage
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), -on-sm, -on-md, -on-lg, -on-xl. **Example .pf-v6-u-h-initial-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-h-initial-on-lg`
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
@@ -130,7 +130,7 @@ section: utility-classes
 
 ### Usage
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), -on-sm, -on-md, -on-lg, -on-xl. **Example .pf-v6-u-h-25vh-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-h-25vh-on-lg`
 
 | Class | Applied to | Outcome |
 | -- | -- | -- |
@@ -188,7 +188,7 @@ section: utility-classes
 | `.pf-v6-u-min-width` | `*` | Sets min-width: `var(--pf-v6-u-min-width--MinWidth{-on-[breakpoint]})`. |
 | `.pf-v6-u-max-width` | `*` | Sets min-width: `var(--pf-v6-u-max-width--MaxWidth{-on-[breakpoint]})`. |
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), -on-sm, -on-md, -on-lg, -on-xl. **Example --pf-v6-u-min-width--MinWidth-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.--pf-v6-u-min-width--MinWidth-on-lg`
 
 | Custom property | Applied to | Outcome |
 | -- | -- | -- |
@@ -242,7 +242,7 @@ section: utility-classes
 | `.pf-v6-u-min-height` | `*` | Sets min-height: `var(--pf-v6-u-min-height--MinHeight{-on-[breakpoint]})`. |
 | `.pf-v6-u-max-height` | `*` | Sets max-height: `var(--pf-v6-u-max-height--MaxHeight{-on-[breakpoint]})`. |
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), -on-sm, -on-md, -on-lg, -on-xl. **Example --pf-v6-u-min-height--MinHeight-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.--pf-v6-u-min-height--MinHeight-on-lg`
 
 | Custom property | Applied to | Outcome |
 | -- | -- | -- |

package/docs/utilities/Spacing/examples/Spacing.md

@@ -118,7 +118,7 @@ pf: 'test'
 
 ### Overview
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-v6-u-m-sm-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-m-sm-on-lg`
 
 ### Margin properties
 

package/docs/utilities/Text/examples/Text.md

@@ -171,7 +171,7 @@ These text utilities can be used to modify text within the PatternFly framework.
 
 Care should be taken especially when applying text colors, as this can have a negative effect on the readability and accessibility of text. Refer to the information on [contrast ratios](/guidelines/colors/#contrast-ratios) for more information.
 
-[Breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) is optional. Breakpoints: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. **Example .pf-v6-u-font-size-xl-on-lg**
+[Breakpoints](/tokens/all-patternfly-tokens) are optional. Breakpoint options include: base (no breakpoint value), `-on-sm`, `-on-md`, `-on-lg`, and `-on-xl`. Example: `.pf-v6-u-font-size-xl-on-lg`
 
 ### Usage
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@patternfly/patternfly",
   "description": "Assets, source, tooling, and content for PatternFly 4",
-  "version": "6.2.0-prerelease.2",
+  "version": "6.2.0-prerelease.4",
   "keywords": [],
   "license": "MIT",
   "scripts": {
@@ -47,7 +47,7 @@
     "@commitlint/config-conventional": "^19.1.0",
     "@fortawesome/fontawesome": "^1.1.8",
     "@octokit/rest": "^20.1.0",
-    "@patternfly/documentation-framework": "6.5.3",
+    "@patternfly/documentation-framework": "6.5.8",
     "@patternfly/patternfly-a11y": "5.0.0",
     "@patternfly/react-code-editor": "6.1.0",
     "@patternfly/react-core": "6.1.0",

package/patternfly-base-no-globals.css

@@ -5665,7 +5665,7 @@
   font-style: normal;
   font-variant: normal;
   font-weight: normal;
-  text-decoration: none;
+  text-decoration-line: none;
   text-transform: none;
 }
 

package/patternfly-base.css

@@ -117,12 +117,12 @@ pre) {
 
 :where(a) {
   color: var(--pf-t--global--text--color--link--default);
-  text-decoration: var(--pf-t--global--text-decoration--link--line--default);
+  text-decoration-line: var(--pf-t--global--text-decoration--link--line--default);
 }
 
 :where(a:hover, a:focus) {
   color: var(--pf-t--global--text--color--link--hover);
-  text-decoration: var(--pf-t--global--text-decoration--link--line--hover);
+  text-decoration-line: var(--pf-t--global--text-decoration--link--line--hover);
 }
 
 :where(a,
@@ -5801,7 +5801,7 @@ button) {
   font-style: normal;
   font-variant: normal;
   font-weight: normal;
-  text-decoration: none;
+  text-decoration-line: none;
   text-transform: none;
 }
 

package/patternfly-charts.css

@@ -661,4 +661,79 @@
   --pf-v6-chart-theme--multi-color-unordered--ColorScale--3300: var(--pf-t--chart--theme--colorscales--multi-colored-unordered--colorscale--3300);
   --pf-v6-chart-theme--multi-color-unordered--ColorScale--3400: var(--pf-t--chart--theme--colorscales--multi-colored-unordered--colorscale--3400);
   --pf-v6-chart-theme--multi-color-unordered--ColorScale--3500: var(--pf-t--chart--theme--colorscales--multi-colored-unordered--colorscale--3500);
+}
+
+:where(:root) {
+  --pf-v6-chart-echarts-global--axis-label--Color: transparent;
+  --pf-v6-chart-echarts-global--axis-line--item-style--Color: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-global--axis-tick--item-style--Color: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-global--label--Color: var(--pf-v6-chart-global--label--Fill);
+  --pf-v6-chart-echarts-BackgroundColor: transparent;
+  --pf-v6-chart-echarts-bar--item-style--BarBorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-bar--item-style--BarBorderWidth: 0;
+  --pf-v6-chart-echarts-boxplot--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-boxplot--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-candlestick--item-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-candlestick--item-style--negative--Color: var(--pf-v6-chart-global--Fill--Color--900);
+  --pf-v6-chart-echarts-candlestick--item-style--positive--Color: var(--pf-v6-chart-global--Fill--Color--white);
+  --pf-v6-chart-echarts-candlestick--item-style--negative--BorderColor: var(--pf-v6-chart-global--Fill--Color--900);
+  --pf-v6-chart-echarts-candlestick--item-style--positive--BorderColor: var(--pf-v6-chart-global--Fill--Color--white);
+  --pf-v6-chart-echarts-datazoom--HandleSize: 100%;
+  --pf-v6-chart-echarts-funnel--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-funnel--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-gauge--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-gauge--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-geo--emphasis--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--200);
+  --pf-v6-chart-echarts-geo--emphasis--item-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-geo--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-geo--item-style--BorderWidth: 0.5;
+  --pf-v6-chart-echarts-graph--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-graph--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-graph--line-style--Color: var(--pf-v6-chart-global--Fill--Color--900);
+  --pf-v6-chart-echarts-graph--line-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-graph--Smooth: false;
+  --pf-v6-chart-echarts-graph--SymbolSize: 4;
+  --pf-v6-chart-echarts-graph--Symbol: "emptyCircle";
+  --pf-v6-chart-echarts-line--item-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-line--line-style--BorderWidth: 2;
+  --pf-v6-chart-echarts-line--Smooth: false;
+  --pf-v6-chart-echarts-line--SymbolSize: 4;
+  --pf-v6-chart-echarts-line--Symbol: "emptyCircle";
+  --pf-v6-chart-echarts-map--emphasis--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--200);
+  --pf-v6-chart-echarts-map--emphasis--item-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-map--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-map--item-style--BorderWidth: 0.5;
+  --pf-v6-chart-echarts-parallel--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-parallel--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-pie--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-pie--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-sankey--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-sankey--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-scatter--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-scatter--item-style--BorderWidth: 0;
+  --pf-v6-chart-echarts-skeleton--label--Color: transparent;
+  --pf-v6-chart-echarts-toolbox--emphasis--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--200);
+  --pf-v6-chart-echarts-toolbox--item-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--300);
+  --pf-v6-chart-echarts-tooltip--axis--pointer--cross-style--Color: var(--pf-v6-chart-global--Fill--Color--900);
+  --pf-v6-chart-echarts-tooltip--axis--pointer--cross-style--Width: 1;
+  --pf-v6-chart-echarts-tooltip--axis--pointer--line-style--Color: var(--pf-v6-chart-global--Fill--Color--900);
+  --pf-v6-chart-echarts-tooltip--axis--pointer--line-style--Width: 1;
+  --pf-v6-chart-echarts-timeline--emphasis--control-style--Color: var(--pf-v6-chart-global--Fill--Color--200);
+  --pf-v6-chart-echarts-timeline--emphasis--control-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--200);
+  --pf-v6-chart-echarts-timeline--emphasis--control-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-timeline--emphasis--item-style--Color: var(--pf-v6-chart-global--Fill--Color--white);
+  --pf-v6-chart-echarts-timeline--checkpoint-style--Color: var(--pf-t--chart--theme--colorscales--blue--colorscale--400);
+  --pf-v6-chart-echarts-timeline--checkpoint-style--BorderColor: var(--pf-v6-chart-global--Fill--Color--white);
+  --pf-v6-chart-echarts-timeline--control-style--Color: var(--pf-t--chart--theme--colorscales--gray--colorscale--100);
+  --pf-v6-chart-echarts-timeline--control-style--BorderColor: var(--pf-t--chart--theme--colorscales--gray--colorscale--100);
+  --pf-v6-chart-echarts-timeline--control-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-timeline--item-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-timeline--item-style--Color: var(--pf-t--chart--theme--colorscales--gray--colorscale--100);
+  --pf-v6-chart-echarts-timeline--line-style--Color: var(--pf-t--chart--theme--colorscales--gray--colorscale--400);
+  --pf-v6-chart-echarts-timeline--line-style--Width: 2;
+  --pf-v6-chart-echarts-radar--item-style--BorderWidth: 1;
+  --pf-v6-chart-echarts-radar--line-style--BorderWidth: 2;
+  --pf-v6-chart-echarts-radar--Smooth: false;
+  --pf-v6-chart-echarts-radar--SymbolSize: 4;
+  --pf-v6-chart-echarts-radar--Symbol: "emptyCircle";
 }

package/patternfly-charts.scss

@@ -432,3 +432,121 @@ $chart: #{$pf-prefix} + 'chart';
   --#{$chart}-theme--multi-color-unordered--ColorScale--3400: var(--pf-t--chart--theme--colorscales--multi-colored-unordered--colorscale--3400);
   --#{$chart}-theme--multi-color-unordered--ColorScale--3500: var(--pf-t--chart--theme--colorscales--multi-colored-unordered--colorscale--3500);
 }
+
+// ECharts styles
+// stylelint-disable-next-line no-duplicate-selectors
+:where(:root) {
+  // Global
+  --#{$chart}-echarts-global--axis-label--Color: transparent;
+  --#{$chart}-echarts-global--axis-line--item-style--Color: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-global--axis-tick--item-style--Color: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-global--label--Color: var(--#{$chart}-global--label--Fill);
+
+  // Basic config
+  --#{$chart}-echarts-BackgroundColor: transparent;
+
+  // Bar chart
+  --#{$chart}-echarts-bar--item-style--BarBorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-bar--item-style--BarBorderWidth: 0;
+
+  // Boxplot
+  --#{$chart}-echarts-boxplot--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-boxplot--item-style--BorderWidth: 0;
+
+  // Candlestick
+  --#{$chart}-echarts-candlestick--item-style--BorderWidth: 1;
+  --#{$chart}-echarts-candlestick--item-style--negative--Color: var(--#{$chart}-global--Fill--Color--900);
+  --#{$chart}-echarts-candlestick--item-style--positive--Color: var(--#{$chart}-global--Fill--Color--white);
+  --#{$chart}-echarts-candlestick--item-style--negative--BorderColor: var(--#{$chart}-global--Fill--Color--900);
+  --#{$chart}-echarts-candlestick--item-style--positive--BorderColor: var(--#{$chart}-global--Fill--Color--white);
+
+  // DataZoom
+  --#{$chart}-echarts-datazoom--HandleSize: 100%;
+
+  // Funnel
+  --#{$chart}-echarts-funnel--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-funnel--item-style--BorderWidth: 0;
+
+  // Gauge
+  --#{$chart}-echarts-gauge--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-gauge--item-style--BorderWidth: 0;
+
+  // Geo
+  --#{$chart}-echarts-geo--emphasis--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--200);
+  --#{$chart}-echarts-geo--emphasis--item-style--BorderWidth: 1;
+  --#{$chart}-echarts-geo--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-geo--item-style--BorderWidth: 0.5;
+
+  // Graph
+  --#{$chart}-echarts-graph--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-graph--item-style--BorderWidth: 0;
+  --#{$chart}-echarts-graph--line-style--Color:  var(--#{$chart}-global--Fill--Color--900);
+  --#{$chart}-echarts-graph--line-style--BorderWidth: 1;
+  --#{$chart}-echarts-graph--Smooth: false;
+  --#{$chart}-echarts-graph--SymbolSize: 4;
+  --#{$chart}-echarts-graph--Symbol: 'emptyCircle';
+
+  // Line
+  --#{$chart}-echarts-line--item-style--BorderWidth: 1;
+  --#{$chart}-echarts-line--line-style--BorderWidth: 2;
+  --#{$chart}-echarts-line--Smooth: false;
+  --#{$chart}-echarts-line--SymbolSize: 4;
+  --#{$chart}-echarts-line--Symbol: 'emptyCircle';
+
+  // Map
+  --#{$chart}-echarts-map--emphasis--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--200);
+  --#{$chart}-echarts-map--emphasis--item-style--BorderWidth: 1;
+  --#{$chart}-echarts-map--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-map--item-style--BorderWidth: 0.5;
+
+  // Parallel
+  --#{$chart}-echarts-parallel--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-parallel--item-style--BorderWidth: 0;
+
+  // Pie
+  --#{$chart}-echarts-pie--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-pie--item-style--BorderWidth: 0;
+
+  // Sankey
+  --#{$chart}-echarts-sankey--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-sankey--item-style--BorderWidth: 0;
+
+  // Scatter
+  --#{$chart}-echarts-scatter--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+  --#{$chart}-echarts-scatter--item-style--BorderWidth: 0;
+
+  // Skeleton
+  --#{$chart}-echarts-skeleton--label--Color: transparent;
+
+  // Toolbox
+  --#{$chart}-echarts-toolbox--emphasis--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--200);
+  --#{$chart}-echarts-toolbox--item-style--BorderColor: var(--#{$chart}-global--Fill--Color--300);
+
+  // Tooltip
+  --#{$chart}-echarts-tooltip--axis--pointer--cross-style--Color: var(--#{$chart}-global--Fill--Color--900);
+  --#{$chart}-echarts-tooltip--axis--pointer--cross-style--Width: 1;
+  --#{$chart}-echarts-tooltip--axis--pointer--line-style--Color: var(--#{$chart}-global--Fill--Color--900);
+  --#{$chart}-echarts-tooltip--axis--pointer--line-style--Width: 1;
+
+  // Timeline
+  --#{$chart}-echarts-timeline--emphasis--control-style--Color: var(--#{$chart}-global--Fill--Color--200);
+  --#{$chart}-echarts-timeline--emphasis--control-style--BorderColor: var(--#{$chart}-global--Fill--Color--200);
+  --#{$chart}-echarts-timeline--emphasis--control-style--BorderWidth: 1;
+  --#{$chart}-echarts-timeline--emphasis--item-style--Color: var(--#{$chart}-global--Fill--Color--white);
+  --#{$chart}-echarts-timeline--checkpoint-style--Color: var(--pf-t--chart--theme--colorscales--blue--colorscale--400);
+  --#{$chart}-echarts-timeline--checkpoint-style--BorderColor: var(--#{$chart}-global--Fill--Color--white);
+  --#{$chart}-echarts-timeline--control-style--Color: var(--pf-t--chart--theme--colorscales--gray--colorscale--100);
+  --#{$chart}-echarts-timeline--control-style--BorderColor: var(--pf-t--chart--theme--colorscales--gray--colorscale--100);
+  --#{$chart}-echarts-timeline--control-style--BorderWidth: 1;
+  --#{$chart}-echarts-timeline--item-style--BorderWidth: 1;
+  --#{$chart}-echarts-timeline--item-style--Color: var(--pf-t--chart--theme--colorscales--gray--colorscale--100);
+  --#{$chart}-echarts-timeline--line-style--Color: var(--pf-t--chart--theme--colorscales--gray--colorscale--400);
+  --#{$chart}-echarts-timeline--line-style--Width: 2;
+
+  // Radar
+  --#{$chart}-echarts-radar--item-style--BorderWidth: 1;
+  --#{$chart}-echarts-radar--line-style--BorderWidth: 2;
+  --#{$chart}-echarts-radar--Smooth: false;
+  --#{$chart}-echarts-radar--SymbolSize: 4;
+  --#{$chart}-echarts-radar--Symbol: 'emptyCircle';
+}