feat(MenuToggle): replaced custom styles with text modifier V6 (patte…

…rnfly#10793) * feat(MenuToggle): replaced custom styles with text modifier V6 * Bumped core versions * Updated snapshots * yarn lock
tlabaj · Jul 26, 2024 · 95a204c · 95a204c
1 parent 390b5bd
commit 95a204c
Show file tree

Hide file tree

Showing 36 changed files with 264 additions and 265 deletions.
diff --git a/packages/react-charts/src/components/Chart/__snapshots__/Chart.test.tsx.snap b/packages/react-charts/src/components/Chart/__snapshots__/Chart.test.tsx.snap
diff --git a/packages/react-charts/src/components/ChartArea/__snapshots__/ChartArea.test.tsx.snap b/packages/react-charts/src/components/ChartArea/__snapshots__/ChartArea.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`ChartArea 1`] = `
           d="M50,250L57,246L64,242L71,238L78,234L85,230L92,226L99,222L106,218L113,214.00000000000003L120,210L127,206L134,202L141,198L148,194L155,190L162,185.99999999999997L169,181.99999999999997L176,178L183,174L190,170L197,166.00000000000003L204,162L211,158L218,154L225,150L232,146L239,142L246.00000000000003,138L252.99999999999997,134L260,130L267,126L274,122L281,117.99999999999999L288,113.99999999999999L295,109.99999999999999L302,106L309,102L316,98L323,94L330,89.99999999999999L337,85.99999999999999L344,82L351,78L358,74L365,70L372,65.99999999999999L379,61.999999999999986L386,58.00000000000001L393,54.00000000000001L400,50L400,250L393,250L386,250L379,250L372,250L365,250L358,250L351,250L344,250L337,250L330,250L323,250L316,250L309,250L302,250L295,250L288,250L281,250L274,250L267,250L260,250L252.99999999999997,250L246.00000000000003,250L239,250L232,250L225,250L218,250L211,250L204,250L197,250L190,250L183,250L176,250L169,250L162,250L155,250L148,250L141,250L134,250L127,250L120,250L113,250L106,250L99,250L92,250L85,250L78,250L71,250L64,250L57,250L50,250Z"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); fill-opacity: 0.3; stroke-width: 2; stroke: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c);"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); fill-opacity: 0.3; stroke-width: 2; stroke: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc);"
         />
       </g>
     </svg>
@@ -86,7 +86,7 @@ exports[`ChartArea 2`] = `
           d="M50,250L57,246L64,242L71,238L78,234L85,230L92,226L99,222L106,218L113,214.00000000000003L120,210L127,206L134,202L141,198L148,194L155,190L162,185.99999999999997L169,181.99999999999997L176,178L183,174L190,170L197,166.00000000000003L204,162L211,158L218,154L225,150L232,146L239,142L246.00000000000003,138L252.99999999999997,134L260,130L267,126L274,122L281,117.99999999999999L288,113.99999999999999L295,109.99999999999999L302,106L309,102L316,98L323,94L330,89.99999999999999L337,85.99999999999999L344,82L351,78L358,74L365,70L372,65.99999999999999L379,61.999999999999986L386,58.00000000000001L393,54.00000000000001L400,50L400,250L393,250L386,250L379,250L372,250L365,250L358,250L351,250L344,250L337,250L330,250L323,250L316,250L309,250L302,250L295,250L288,250L281,250L274,250L267,250L260,250L252.99999999999997,250L246.00000000000003,250L239,250L232,250L225,250L218,250L211,250L204,250L197,250L190,250L183,250L176,250L169,250L162,250L155,250L148,250L141,250L134,250L127,250L120,250L113,250L106,250L99,250L92,250L85,250L78,250L71,250L64,250L57,250L50,250Z"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); fill-opacity: 0.3; stroke-width: 2; stroke: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c);"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); fill-opacity: 0.3; stroke-width: 2; stroke: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc);"
         />
       </g>
     </svg>
@@ -138,7 +138,7 @@ exports[`renders component data 1`] = `
           d="M50,192.85714285714286L166.66666666666666,135.71428571428572L283.3333333333333,67.14285714285712L400,50L400,250L283.3333333333333,250L166.66666666666666,250L50,250Z"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); fill-opacity: 0.3; stroke-width: 2; stroke: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c);"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); fill-opacity: 0.3; stroke-width: 2; stroke: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc);"
         />
       </g>
     </svg>

diff --git a/packages/react-charts/src/components/ChartAxis/__snapshots__/ChartAxis.test.tsx.snap b/packages/react-charts/src/components/ChartAxis/__snapshots__/ChartAxis.test.tsx.snap
diff --git a/packages/react-charts/src/components/ChartBar/__snapshots__/ChartBar.test.tsx.snap b/packages/react-charts/src/components/ChartBar/__snapshots__/ChartBar.test.tsx.snap
diff --git a/packages/react-charts/src/components/ChartBoxPlot/__snapshots__/ChartBoxPlot.test.tsx.snap b/packages/react-charts/src/components/ChartBoxPlot/__snapshots__/ChartBoxPlot.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`ChartBar 1`] = `
           height="55.55555555555554"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="40"
@@ -30,7 +30,7 @@ exports[`ChartBar 1`] = `
           height="33.33333333333334"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="390"
@@ -40,7 +40,7 @@ exports[`ChartBar 1`] = `
           height="66.66666666666666"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="40"
@@ -50,7 +50,7 @@ exports[`ChartBar 1`] = `
           height="44.44444444444446"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="390"
@@ -200,7 +200,7 @@ exports[`ChartBar 2`] = `
           height="55.55555555555554"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="40"
@@ -210,7 +210,7 @@ exports[`ChartBar 2`] = `
           height="33.33333333333334"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="390"
@@ -220,7 +220,7 @@ exports[`ChartBar 2`] = `
           height="66.66666666666666"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="40"
@@ -230,7 +230,7 @@ exports[`ChartBar 2`] = `
           height="44.44444444444446"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="390"
@@ -380,7 +380,7 @@ exports[`renders component data 1`] = `
           height="8.333333333333314"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="70"
@@ -390,7 +390,7 @@ exports[`renders component data 1`] = `
           height="30.55555555555557"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="118.33333333333331"
@@ -400,7 +400,7 @@ exports[`renders component data 1`] = `
           height="13.888888888888886"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="166.66666666666666"
@@ -410,7 +410,7 @@ exports[`renders component data 1`] = `
           height="8.333333333333314"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="214.99999999999997"
@@ -420,7 +420,7 @@ exports[`renders component data 1`] = `
           height="11.111111111111128"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="70"
@@ -430,7 +430,7 @@ exports[`renders component data 1`] = `
           height="33.33333333333334"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="118.33333333333331"
@@ -440,7 +440,7 @@ exports[`renders component data 1`] = `
           height="11.111111111111114"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="166.66666666666666"
@@ -450,7 +450,7 @@ exports[`renders component data 1`] = `
           height="22.22222222222223"
           role="presentation"
           shape-rendering="auto"
-          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #06c); padding: 8px;"
+          style="fill: var(--pf-v6-chart-theme--blue--ColorScale--100, #0066cc); padding: 8px;"
           vector-effect="non-scaling-stroke"
           width="20"
           x="214.99999999999997"
@@ -709,7 +709,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="middle"
               x="80"
             >
@@ -740,7 +740,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="middle"
               x="128.33333333333331"
             >
@@ -771,7 +771,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="middle"
               x="176.66666666666666"
             >
@@ -802,7 +802,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="middle"
               x="224.99999999999997"
             >
@@ -847,7 +847,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="end"
               x="35"
             >
@@ -878,7 +878,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="end"
               x="35"
             >
@@ -909,7 +909,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="end"
               x="35"
             >
@@ -940,7 +940,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="end"
               x="35"
             >
@@ -971,7 +971,7 @@ exports[`renders component data 1`] = `
             <tspan
               dx="0"
               dy="0"
-              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",helvetica,arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
+              style="font-family: "RedHatText","RedHatText","NotoSansArabic","NotoSansHebrew","NotoSansJP","NotoSansKR","NotoSansMalayalam","NotoSansSC","NotoSansTC","NotoSansThai",Helvetica,Arial,sans-serif; font-size: 14px; letter-spacing: normal; padding: 10px; stroke: var(--pf-v6-chart-global--label--stroke, transparent); fill: var(--pf-v6-chart-axis--tick-label--Fill, #383838);"
               text-anchor="end"
               x="35"
             >