How to use the @patternfly/react-tokens.global_warning_color_100.value function in @patternfly/react-tokens

function getBackground(status, backgroundColor = global_Color_light_100.value) {
  switch (status) {
    case "running":
      return `linear-gradient(to right,${global_active_color_100.value} 0,${
        global_active_color_100.value
      } 5px,${backgroundColor} 5px,${backgroundColor} 100%) no-repeat`;
    case "completed":
      return `linear-gradient(to right,${global_success_color_100.value} 0,${
        global_success_color_100.value
      } 5px,${backgroundColor} 5px,${backgroundColor} 100%) no-repeat`;
    case "failed":
      return `linear-gradient(to right,${global_danger_color_100.value} 0,${
        global_danger_color_100.value
      } 5px,${backgroundColor} 5px,${backgroundColor} 100%) no-repeat`;
    default:
      return `linear-gradient(to right,${global_warning_color_100.value} 0,${
        global_warning_color_100.value
      } 5px,${backgroundColor} 5px,${backgroundColor} 100%) no-repeat`;
  }
}

const Status = ({ status, children }) => {
  const colors = {
    ok: global_success_color_100.value,
    failed: global_danger_color_100.value,
    skipped: global_active_color_100.value,
    unreachable: global_warning_color_100.value,
    changed: global_active_color_100.value,
    ignored: global_warning_color_100.value,
    unknown: global_warning_color_100.value
  };
  return (
    <span style="{{">
      {children}
    </span>
  );
};

/>
      );
    case "failed":
      return (
        
      );
    default:
      return (
        
      );
  }
};

export const YellowExclamationTriangleIcon: React.FC = ({ className, alt }) => {
  return ;
};

const Status = ({ status, children }) => {
  const colors = {
    ok: global_success_color_100.value,
    failed: global_danger_color_100.value,
    skipped: global_active_color_100.value,
    unreachable: global_warning_color_100.value,
    changed: global_active_color_100.value,
    ignored: global_warning_color_100.value,
    unknown: global_warning_color_100.value
  };
  return (
    <span style="{{">
      {children}
    </span>
  );
};

const Status = ({ status, children }) => {
  const colors = {
    ok: global_success_color_100.value,
    failed: global_danger_color_100.value,
    skipped: global_active_color_100.value,
    unreachable: global_warning_color_100.value,
    changed: global_active_color_100.value,
    ignored: global_warning_color_100.value,
    unknown: global_warning_color_100.value
  };
  return (
    <span style="{{">
      {children}
    </span>
  );
};