how to hide both axis lines in chartJs(options isn't working)

Question

I am using bar chart and want to hide the both axis line. I've tried the following but it doesn't work.

=>> Actually, I'm making a chart using ChartJS. Everything has gone smoothly, with one exception: Although the X-axis line (the line that runs horizontally along the base of the chart) is drawing, the Y-axis line (the one that runs vertically along the left) is not, even though I've applied nearly identical configurations.

I've played around with this extensively, and can't figure out what I'm doing wrong.

/** @type {import("@theme-ui/css").Theme} */
import { Box, Container } from '@theme-ui/components'
import React from 'react'
import { Bar } from 'react-chartjs-2'

const data = {
    labels: ['Mon', 'Tue', 'Wed', 'Fri', 'Sat'],
    datasets: [
        {
            label: 'Fully Rounded',
            data: [6, 2, 3, 5, 2],
            borderWidth: 0,
            borderRadius: 9,
            borderSkipped: false,
            display: false,
            borderColor: 'transparent',
            backgroundColor: "#FF8D1E",
        },
        {
            label: 'Small Radius',
            data: [3, 2, 6, 4, 5],
            borderWidth: 0,
            borderRadius: 9,
            borderSkipped: false,
            display: false,
            borderColor: 'transparent',
            backgroundColor: '#6AC1FF',
            color: 'rgba(0, 0, 0, 0.1)',
        }
    ]
};

const option = {
    scales: {
        x: [{
            grid: {
                drawBorder: false,
                drawOnChartArea: false
            },
        }],
        y: [{
            grid: {
                drawBorder: false,
                drawOnChartArea: false
            },
        }]
    },
    maintainAspectRatio: true
}

function Charts() {

    return (
        <Container sx={styles.container}>
            <h2>Number of Patients</h2>
            <Box sx={styles.chart}>
                <Bar
                    data={data}
                    width={40}
                    height={20}
                    options={option}
                />
            </Box>
        </Container>
    )
}

export default Charts;

const styles = {
    container: {
        p: "12px"
    },
    chart: {
        bg: "#605BFF",
        borderRadius: "27px",
        p: ["20px"],
        color: "red"
    }
}

actually I want to remove the axis line of the picture like

please help me someone.

I'm making a chart using ChartJS. Everything has gone smoothly, with one exception: Although the X-axis line (the line that runs horizontally along the base of the chart) is drawing, the Y-axis line (the one that runs vertically along the left) is not, even though I've applied nearly identical configurations.

I've played around with this extensively, and can't figure out what I'm doing wrong.