Use pf variables & update lockfile

Author: fhlavac

package-lock.json

@@ -1,24 +1,20 @@
 import * as React from 'react';
 import { Text } from '@patternfly/react-core';
 import { createUseStyles } from 'react-jss';
-import { global_BackgroundColor_dark_300 as backgroundDark } from '@patternfly/react-tokens/dist/js/global_BackgroundColor_dark_300';
-import { global_icon_FontSize_md as iconMd } from '@patternfly/react-tokens/dist/js/global_icon_FontSize_md';
-import { global_spacer_sm as spacerSm } from '@patternfly/react-tokens/dist/js/global_spacer_sm';
-
 interface ErrorStackProps {
   error: Error;
 }
 
 const useStyles = createUseStyles({
   errorStack: {
     fontFamily: 'monospace',
-    fontSize: iconMd.value,
+    fontSize: 'var(--pf-global--icon--FontSize--md)',
     textAlign: 'left',
     backgroundColor: 'white',
     borderStyle: 'solid',
-    borderColor: backgroundDark.value,
+    borderColor: 'var(--pf-global--BackgroundColor--dark-300)',
     overflowWrap: 'break-word',
-    padding: spacerSm.value
+    padding: 'var(--pf-global--spacer--sm)'
   },
 })
 

packages/module/src/ErrorBoundary/ErrorStack.tsx

@@ -13,11 +13,10 @@ import {
   Title,
 } from '@patternfly/react-core';
 import { createUseStyles } from 'react-jss'
-import { global_danger_color_100 as dangerColor } from '@patternfly/react-tokens/dist/js/global_danger_color_100';
 
 const useStyles = createUseStyles({
   errorIcon: {
-    fill: dangerColor.value,
+    fill: 'var(--pf-global--danger-color--100)',
   },
 })