import * as __WEBPACK_EXTERNAL_MODULE__storybook_test__ from "@storybook/test";
import * as __WEBPACK_EXTERNAL_MODULE__ResourceList_mjs__ from "./ResourceList.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__chakra_ui_react__ from "@chakra-ui/react";
const lorem = `
  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
  labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
  laboris nisi ut aliquip ex ea commodo consequat.
`;
const LoremIpsum = ({ iterations = 1, ...rest })=>{
    const texts = [];
    for(let i = 0; i < iterations; i++)texts.push(/*#__PURE__*/ React.createElement(__WEBPACK_EXTERNAL_MODULE__chakra_ui_react__.Text, rest, lorem));
    return /*#__PURE__*/ React.createElement(React.Fragment, null, texts);
};
/* ESM default export */ const content_helper = LoremIpsum;
const meta = {
    title: 'Components/ResourceList',
    component: __WEBPACK_EXTERNAL_MODULE__ResourceList_mjs__["default"],
    parameters: {
        design: {
            type: 'figma',
            url: 'https://www.figma.com/file/bJcVrZNilxa06jYuVCGWYd/Redpanda-Design-System-2023?type=design&node-id=36-1193&mode=design'
        }
    }
};
/* ESM default export */ const ResourceList_stories_rslib_entry_ = meta;
const columns = [
    {
        key: 'title',
        content: 'Title',
        width: '2fr'
    },
    {
        key: 'subtitle',
        content: 'Subtitle'
    }
];
const rows = [
    {
        key: 'row1',
        id: 'r1',
        title: 'title-1',
        subtitle: 'subtitle-1',
        link: '/row1-link'
    },
    {
        key: 'row2',
        id: 'r2',
        title: 'title-2',
        subtitle: 'subtitle-2'
    },
    {
        key: 'row3',
        id: 'r3',
        title: 'title-3',
        subtitle: 'subtitle-3'
    },
    {
        key: 'row4',
        id: 'r4',
        title: 'title-4',
        subtitle: 'subtitle-4',
        onClick: ()=>{
            alert('clicked the row');
        }
    },
    {
        key: '',
        id: 'r5',
        title: 'title-5 (empty key)',
        subtitle: 'subtitle-5'
    }
];
const Default = {
    args: {
        columns,
        rows
    },
    play: async ({ canvasElement, step })=>{
        const canvas = (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.within)(canvasElement);
        await step('Check resource list headings', async ()=>{
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('resource-list-column-Title')).toBeVisible();
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('resource-list-column-Subtitle')).toBeVisible();
        });
        await step('Check elements', async ()=>{
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('row1-link')).toBeVisible();
        });
    }
};
const SelfAligned = {
    args: {
        columns,
        rows,
        alignSelf: 'center'
    }
};
const Empty = {
    args: {
        columns,
        rows: []
    },
    play: async ({ canvasElement, step })=>{
        const canvas = (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.within)(canvasElement);
        await step('Check empty state appears', async ()=>{
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('no-data-heading')).toBeVisible();
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('no-data-heading')).toHaveTextContent('No data found');
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('no-data-image')).toBeVisible();
        });
    }
};
const NoColumns = {
    args: {
        columns,
        rows,
        showColumns: false
    },
    play: async ({ canvasElement, step })=>{
        const canvas = (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.within)(canvasElement);
        await step('Check no columns appear', async ()=>{
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.queryByTestId('resource-list-column-Title')).not.toBeInTheDocument();
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.queryByTestId('resource-list-column-Subtitle')).not.toBeInTheDocument();
        });
    }
};
const AsAccordionWithColumns = {
    args: {
        columns,
        rows: [
            {
                key: 'row1',
                id: 'r1',
                title: 'title-1',
                subtitle: 'subtitle-1',
                content: /*#__PURE__*/ React.createElement(content_helper, null)
            }
        ],
        showColumns: true,
        isExpandable: true
    },
    play: async ({ canvasElement, step })=>{
        const canvas = (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.within)(canvasElement);
        await step('Check content chevron icon', async ()=>{
            (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('content-chevron-icon')).toBeVisible();
        });
        __WEBPACK_EXTERNAL_MODULE__storybook_test__.fireEvent.click(canvas.getByTestId('content-chevron-icon'));
        await step('Check content appears', async ()=>{
            await (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.waitFor)(()=>(0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.getByTestId('content-wrapper')).toBeVisible());
        });
        __WEBPACK_EXTERNAL_MODULE__storybook_test__.fireEvent.click(canvas.getByTestId('content-chevron-icon'));
        await step('Check content hides', async ()=>{
            await (0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.waitFor)(()=>(0, __WEBPACK_EXTERNAL_MODULE__storybook_test__.expect)(canvas.queryByTestId('content-wrapper')).not.toBeVisible());
        });
    }
};
const AsAccordion = {
    args: {
        columns,
        rows: [
            {
                key: 'row1',
                id: 'r1',
                title: 'title-1',
                subtitle: 'subtitle-1',
                content: /*#__PURE__*/ React.createElement(content_helper, null)
            },
            {
                key: 'row2',
                id: 'r2',
                title: 'title-2',
                subtitle: 'subtitle-2',
                content: /*#__PURE__*/ React.createElement(content_helper, null)
            }
        ],
        showColumns: false,
        isExpandable: true
    },
    parameters: {
        design: {
            type: 'figma',
            url: 'https://www.figma.com/file/gVsqDS0XOFARD6d1513YXy/GCP-Marketplace-integration---Self-serve?type=design&node-id=742-1313&mode=design&t=lJys5w00P9NKNsRs-4'
        }
    }
};
export { AsAccordion, AsAccordionWithColumns, Default, Empty, NoColumns, SelfAligned, ResourceList_stories_rslib_entry_ as default };
