@pinnacle0/web-ui 0.3.23 → 0.3.26

package/test/ui-test/src/component/admin/TablePageDemo.tsx

@@ -1,85 +0,0 @@
-import React from "react";
-import {AdminPage} from "@pinnacle0/web-ui/admin/AdminPage";
-import {Form} from "@pinnacle0/web-ui/core/Form";
-import {Input} from "@pinnacle0/web-ui/core/Input";
-import {Amount} from "@pinnacle0/web-ui/core/Amount";
-import {Table} from "@pinnacle0/web-ui/core/Table";
-import {Button} from "@pinnacle0/web-ui/core/Button";
-import {Pagination} from "@pinnacle0/web-ui/core/Pagination";
-import {EnumSelect} from "@pinnacle0/web-ui/core/EnumSelect";
-import {EnumRadio} from "@pinnacle0/web-ui/core/EnumRadio";
-import {Cascader} from "@pinnacle0/web-ui/core/Cascader";
-import {Tooltip} from "@pinnacle0/web-ui/core/Tooltip";
-import {DateTimeRangePicker} from "@pinnacle0/web-ui/core/DateTimeRangePicker";
-import {AmountRangeInput} from "@pinnacle0/web-ui/core/AmountRangeInput";
-import {generateDummyTableData, dummyTableColumns} from "../../dummy/dummyTableData";
-import {dummyEmptyCallback} from "../../dummy/dummyCallback";
-
-const tableData = generateDummyTableData(12);
-
-const FilterExpansion = () => {
-    return (
-        <React.Fragment>
-            <Form.Item label="Input">
-                <Input value="Some name" onChange={dummyEmptyCallback} />
-            </Form.Item>
-            <Form.Item label="Select" required>
-                <EnumSelect list={["A", "B"]} value="A" onChange={dummyEmptyCallback} />
-            </Form.Item>
-            <Form.Item label="Cascader">
-                <Cascader data={[]} value="A" onChange={dummyEmptyCallback} />
-            </Form.Item>
-            <Form.Item label="Radio">
-                <EnumRadio list={["A", "B"]} value="A" onChange={dummyEmptyCallback} />
-            </Form.Item>
-        </React.Fragment>
-    );
-};
-
-export const TablePageDemo = () => {
-    const [loading, setLoading] = React.useState(false);
-    const changeLoading = () => {
-        setLoading(true);
-        setTimeout(() => setLoading(false), 1000);
-    };
-    return (
-        <AdminPage>
-            <AdminPage.Filter
-                loading={loading}
-                expandedArea={<FilterExpansion />}
-                reminder="Some Reminder Text"
-                extraElements={[
-                    <Button color="red" disabled key="1">
-                        Disabled
-                    </Button>,
-                    <Tooltip title="Tooltip content ..." key="2">
-                        <Button color="green">Green Tooltip</Button>
-                    </Tooltip>,
-                ]}
-                onFinish={changeLoading}
-                onReset={changeLoading}
-            >
-                <Form.Item label="Input">
-                    <Input value="Some name" onChange={dummyEmptyCallback} />
-                </Form.Item>
-                <Form.Item label="Level" required>
-                    <EnumSelect.Nullable value={1} list={[1, 2, 3]} onChange={dummyEmptyCallback} />
-                </Form.Item>
-                <Form.Item label="Long Content" required>
-                    <EnumSelect.Nullable value={1} list={[1, 2, 3, "Test long long long long long long long long long etc"]} onChange={dummyEmptyCallback} />
-                </Form.Item>
-                <Form.Item label="Date Range" required>
-                    <DateTimeRangePicker allowNull={false} value={[new Date(), new Date()]} onChange={dummyEmptyCallback} />
-                </Form.Item>
-                <Form.Item label="Amount Range">
-                    <AmountRangeInput allowNull={false} value={[2, 5]} onChange={dummyEmptyCallback} />
-                </Form.Item>
-            </AdminPage.Filter>
-            <AdminPage.Summary>
-                Total amount: <Amount scale={2} value={98432} />
-            </AdminPage.Summary>
-            <Table columns={dummyTableColumns} dataSource={tableData} rowKey="index" loading={loading} />
-            <Pagination totalCount={300} totalPage={20} onChange={dummyEmptyCallback} onShowSizeChange={dummyEmptyCallback} pageIndex={1} />
-        </AdminPage>
-    );
-};

package/test/ui-test/src/component/core/AmountDemo.tsx

@@ -1,117 +0,0 @@
-import React from "react";
-import {Amount} from "@pinnacle0/web-ui/core/Amount";
-import type {DemoHelperGroupConfig} from "../DemoHelper";
-import {DemoHelper} from "../DemoHelper";
-
-const groups: DemoHelperGroupConfig[] = [
-    {
-        title: "Basic",
-        components: [
-            <Amount value={null} scale={2} />,
-            <Amount value={0} scale={2} />,
-            <Amount value={10} scale={2} />,
-            <Amount value={9999} scale={2} />,
-            <Amount value={999999999} scale={2} />,
-            <Amount value={999999999} scale={10} />,
-        ],
-    },
-    {
-        title: "Flooring",
-        components: [
-            <Amount value={999999999.678} scale={0} />,
-            <Amount value={999999999.678} scale={0} rounding="floor" />,
-            <Amount value={999999999.678} scale={0} rounding="ceil" />,
-            "-",
-            <Amount value={999999999.678} scale={1} />,
-            <Amount value={999999999.678} scale={1} rounding="floor" />,
-            <Amount value={999999999.678} scale={1} rounding="ceil" />,
-            "-",
-            <Amount value={999999999.678} scale={2} />,
-            <Amount value={999999999.678} scale={2} rounding="floor" />,
-            <Amount value={999999999.678} scale={2} rounding="ceil" />,
-            "-",
-            <Amount value={999999999.678} scale={3} />,
-            <Amount value={999999999.678} scale={3} rounding="floor" />,
-            <Amount value={999999999.678} scale={3} rounding="ceil" />,
-            "-",
-            <Amount value={999999999.678} scale={4} />,
-            <Amount value={999999999.678} scale={4} rounding="floor" />,
-            <Amount value={999999999.678} scale={4} rounding="ceil" />,
-        ],
-    },
-    {
-        title: "Coloring",
-        components: [
-            <Amount value={9999} scale={1} colorScheme="green+red-" />,
-            <Amount value={0} scale={1} colorScheme="green+red-" />,
-            <Amount value={-9999} scale={1} colorScheme="green+red-" />,
-            "-",
-            <Amount value={9999} scale={1} colorScheme="green-red+" />,
-            <Amount value={0} scale={1} colorScheme="green-red+" />,
-            <Amount value={-9999} scale={1} colorScheme="green-red+" />,
-            "-",
-            <Amount value={9999} scale={3} colorScheme="highlight" />,
-            <Amount value={-9999} scale={3} colorScheme="highlight" />,
-        ],
-    },
-    {
-        title: "Decoration",
-        components: [
-            <Amount value={6789.23} scale={3} del />,
-            <Amount value={6789.23} scale={3} underline />,
-            <Amount value={6789.23} scale={3} bold />,
-            <Amount value={6789.23} scale={3} plusSignForPositive />,
-            <Amount value={6789.23} scale={3} thousandSplitter={false} />,
-        ],
-    },
-    {
-        title: "Postfix/Prefix",
-        components: [
-            <Amount value={6789.23} scale={3} prefix=">>" postfix="<<" />,
-            <Amount value={6789.23} scale={3} prefix=">>" postfix="<<" colorScheme="highlight" />,
-            <Amount value={6789.23} scale={3} prefix=">>" />,
-            <Amount value={6789.23} scale={3} del underline bold postfix="<<" />,
-        ],
-    },
-    {
-        title: "Percentage",
-        components: [
-            <Amount.Percentage value={0.5} percentageScale={2} />,
-            <Amount.Percentage value={0.6} percentageScale={0} />,
-            <Amount.Percentage value={0} percentageScale={3} />,
-            <Amount.Percentage value={-1.2} percentageScale={1} colorScheme="green+red-" />,
-        ],
-    },
-    {
-        title: "With Surrounding Text",
-        components: [
-            <div>
-                test
-                <Amount value={6789.23} scale={3} del underline bold prefix=">>" postfix="<<" />
-                test
-            </div>,
-            <span>
-                test
-                <Amount value={6789.23} scale={3} del underline bold prefix=">>" postfix="<<" />
-                test
-            </span>,
-            <div>
-                <span>test </span>
-                <Amount value={6789.23} scale={3} del underline bold prefix=">>" postfix="<<" />
-                test
-            </div>,
-            <p>
-                test
-                <Amount value={6789.23} scale={3} del underline bold prefix=">>" postfix="<<" />
-                test
-            </p>,
-            <div>
-                <span style={{fontSize: 30}}>test</span>
-                <Amount value={6789.23} scale={3} del underline bold prefix=">>" postfix="<<" />
-                <span style={{fontSize: 10}}>test</span>
-            </div>,
-        ],
-    },
-];
-
-export const AmountDemo = () => <DemoHelper groups={groups} />;

package/test/ui-test/src/component/core/ButtonDemo/__tests__/__snapshots__/dom-snapshot.test.tsx.snap

@@ -1,12 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Button (dom snapshot test) render with children: "button children text" 1`] = `
-<div>
-  <button
-    class="g-button primary medium "
-    type="button"
-  >
-    button children text
-  </button>
-</div>
-`;

package/test/ui-test/src/component/core/ButtonDemo/__tests__/dom-snapshot.test.tsx

@@ -1,10 +0,0 @@
-import React from "react";
-import {Button} from "@pinnacle0/web-ui/core/Button";
-import {render} from "@testing-library/react";
-
-describe("Button (dom snapshot test)", () => {
-    test('render with children: "button children text"', () => {
-        const {container} = render(<Button>button children text</Button>);
-        expect(container).toMatchSnapshot();
-    });
-});

package/test/ui-test/src/component/core/ButtonDemo/__tests__/smoke.test.tsx

@@ -1,71 +0,0 @@
-import React from "react";
-import type {ButtonColor, ButtonSize, Props} from "@pinnacle0/web-ui/core/Button";
-import {Button} from "@pinnacle0/web-ui/core/Button";
-import {render, screen} from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-
-describe("Button (smoke test)", () => {
-    test("renders children on screen", () => {
-        render(<Button>button children text</Button>);
-        expect(screen.queryAllByText(/button children text/i)).toHaveLength(1);
-    });
-
-    test("onClick fires", async () => {
-        const user = userEvent.setup();
-        const onClick = jest.fn();
-        render(<Button onClick={onClick}>button text</Button>);
-
-        const button = screen.getByText(/button text/i);
-
-        await user.click(button);
-        expect(onClick).toHaveBeenCalledTimes(1);
-
-        await userEvent.click(button);
-        expect(onClick).toHaveBeenCalledTimes(2);
-    });
-});
-
-describe("Custom Button (smoke test)", () => {
-    test("extend Color ", () => {
-        type CustomColor = ButtonColor | "new-color";
-        const CustomButton = (props: Props<CustomColor>) => <Button {...props} />;
-
-        render(<CustomButton color="new-color" />);
-        expect(screen.getByRole("button")?.classList).toContain("new-color");
-    });
-
-    test("extend Size ", () => {
-        type CustomSize = ButtonSize | "jumbo";
-        const CustomButton = (props: Props<ButtonColor, CustomSize>) => <Button {...props} />;
-
-        render(<CustomButton size="jumbo" />);
-        expect(screen.getByRole("button")?.classList).toContain("jumbo");
-    });
-});
-
-describe("Button (type test)", () => {
-    // type CustomColor = ButtonColor | "new-color";
-    // type CustomSize = ButtonSize | "jumbo";
-
-    test.skip("button", () => {
-        const Wrapper = () => {
-            return (
-                <React.Fragment>
-                    <Button color="primary" />
-                    <Button color="green" />
-                    <Button color="wire-frame" />;
-                    <Button size="small" />
-                    <Button size="medium" />
-                </React.Fragment>
-            );
-
-            // // @ts-expect-error
-            // return <Button color="bad" />;
-
-            // // @ts-expect-error
-            // return <Button size="bad" />;
-        };
-    });
-
-    // test.todo("Custom  Button");
-});

package/test/ui-test/src/component/core/ButtonDemo/index.tsx

@@ -1,39 +0,0 @@
-import React from "react";
-import type {ButtonColor, ButtonSize} from "@pinnacle0/web-ui/core/Button";
-import {Button} from "@pinnacle0/web-ui/core/Button";
-import type {DemoHelperGroupConfig} from "../../DemoHelper";
-import {DemoHelper} from "../../DemoHelper";
-
-const colors: ButtonColor[] = ["primary", "wire-frame", "green", "red"];
-
-const coloredButtons = (size: ButtonSize): React.ReactElement[] => {
-    const buttons = colors.map(color => (
-        <Button size={size} color={color}>
-            {color}
-        </Button>
-    ));
-    buttons.push(
-        <Button size={size} disabled>
-            disabled
-        </Button>
-    );
-    return buttons;
-};
-
-const groups: DemoHelperGroupConfig[] = [
-    {
-        title: "Button",
-        components: [
-            // prettier-reserve
-            ...coloredButtons("small"),
-            "-",
-            ...coloredButtons("medium"),
-            "-",
-            ...coloredButtons("large"),
-            "-",
-            ...coloredButtons("x-large"),
-        ],
-    },
-];
-
-export const ButtonDemo = () => <DemoHelper groups={groups} />;

package/test/ui-test/src/component/core/CalendarDemo.tsx

@@ -1,98 +0,0 @@
-import React from "react";
-import type {Props as DatePickerProps} from "@pinnacle0/web-ui/core/DatePicker";
-import {DatePicker} from "@pinnacle0/web-ui/core/DatePicker";
-import type {Props as DateRangePickerProps} from "@pinnacle0/web-ui/core/DateRangePicker";
-import {DateRangePicker} from "@pinnacle0/web-ui/core/DateRangePicker";
-import type {Props as TimeRangePickerProps} from "@pinnacle0/web-ui/core/TimeRangePicker";
-import {TimeRangePicker} from "@pinnacle0/web-ui/core/TimeRangePicker";
-import type {Props as TimePickerProps} from "@pinnacle0/web-ui/core/TimePicker";
-import {TimePicker} from "@pinnacle0/web-ui/core/TimePicker";
-import type {Props as DateTimeRangePickerProps} from "@pinnacle0/web-ui/core/DateTimeRangePicker";
-import {DateTimeRangePicker} from "@pinnacle0/web-ui/core/DateTimeRangePicker";
-import type {Props as DateTimePickerProps} from "@pinnacle0/web-ui/core/DateTimePicker";
-import {DateTimePicker} from "@pinnacle0/web-ui/core/DateTimePicker";
-import {DateCalendar} from "@pinnacle0/web-ui/core/DateCalendar";
-import {YearMonthSelector} from "@pinnacle0/web-ui/core/YearMonthSelector";
-import {withUncontrolledInitialValue} from "../../util/withUncontrolledInitialValue";
-import type {DemoHelperGroupConfig} from "../DemoHelper";
-import {DemoHelper} from "../DemoHelper";
-
-const UncontrolledDatePicker = (props: Omit<DatePickerProps<any>, "value" | "onChange">) => {
-    const [value, onChange] = React.useState<any>(null);
-    return <DatePicker {...props} value={value} onChange={onChange} />;
-};
-
-const UncontrolledDateRangePicker = (props: Omit<DateRangePickerProps<any>, "value" | "onChange">) => {
-    const [value, onChange] = React.useState<any>([null, null]);
-    return <DateRangePicker {...props} value={value} onChange={onChange} />;
-};
-
-const UncontrolledTimePicker = (props: Omit<TimePickerProps<any>, "value" | "onChange">) => {
-    const [value, onChange] = React.useState<any>(null);
-    return <TimePicker {...props} value={value} onChange={onChange} placeholder="Select Time" />;
-};
-
-const UncontrolledTimeRangePicker = (props: Omit<TimeRangePickerProps<any>, "value" | "onChange">) => {
-    const [value, onChange] = React.useState<any>([null, null]);
-    return <TimeRangePicker {...props} value={value} onChange={onChange} />;
-};
-
-const UncontrolledDateTimePicker = (props: Omit<DateTimePickerProps<any>, "value" | "onChange">) => {
-    const [value, onChange] = React.useState<any>(null);
-    return <DateTimePicker {...props} value={value} onChange={onChange} />;
-};
-
-const UncontrolledDateTimeRangePicker = (props: Omit<DateTimeRangePickerProps<any>, "value" | "onChange">) => {
-    const [value, onChange] = React.useState<any>([null, null]);
-    return <DateTimeRangePicker disabledRange={_ => _ > 1 && _ < 4} {...props} value={value} onChange={onChange} />;
-};
-
-const UncontrolledYearMonthPicker = withUncontrolledInitialValue(YearMonthSelector);
-
-const groups: DemoHelperGroupConfig[] = [
-    {
-        title: "Date Picker",
-        components: [<UncontrolledDatePicker allowNull={false} />, <UncontrolledDatePicker allowNull />],
-    },
-    {
-        title: "Date Range Picker",
-        components: [<UncontrolledDateRangePicker allowNull={false} />, <UncontrolledDateRangePicker allowNull />],
-    },
-    {
-        title: "Time Picker",
-        components: [<UncontrolledTimePicker allowNull={false} />, <UncontrolledTimePicker allowNull />],
-    },
-    {
-        title: "Time Range Picker",
-        components: [<UncontrolledTimeRangePicker allowNull={false} />, <UncontrolledTimeRangePicker allowNull />],
-    },
-    {
-        title: "Date Time Picker",
-        components: [<UncontrolledDateTimePicker allowNull={false} />, <UncontrolledDateTimePicker allowNull />],
-    },
-    {
-        title: "Date Time Range Picker",
-        components: [<UncontrolledDateTimeRangePicker allowNull={false} />, <UncontrolledDateTimeRangePicker allowNull />],
-    },
-    {
-        title: "Date Calendar",
-        components: [<DateCalendarDemo />],
-        showPropsHint: false,
-    },
-    {
-        title: "Year Month Picker (Disable Future Months & 1 Year Ago)",
-        components: [<UncontrolledYearMonthPicker allowNull initialValue={null} disabledRange={diff => diff < -12 || diff > 0} />],
-    },
-];
-
-function DateCalendarDemo() {
-    const [date, setDate] = React.useState(new Date().toISOString());
-
-    return (
-        <div style={{width: 400}}>
-            <DateCalendar value={date} onChange={setDate} />
-        </div>
-    );
-}
-
-export const CalendarDemo = () => <DemoHelper groups={groups.map(_ => ({..._, showPropsHint: false}))} />;

package/test/ui-test/src/component/core/CarouselDemo/index.tsx

@@ -1,51 +0,0 @@
-import React from "react";
-import {Carousel3D} from "@pinnacle0/web-ui/core/Carousel3D";
-import {Carousel} from "@pinnacle0/web-ui/core/Carousel";
-import {generateDummyURLs} from "../../../dummy/dummyList";
-import type {DemoHelperGroupConfig} from "../../DemoHelper";
-import {DemoHelper} from "../../DemoHelper";
-
-const groups: DemoHelperGroupConfig[] = [
-    {
-        title: "Carousel3D",
-        showPropsHint: false,
-        components: [
-            <div style={{width: 600, overflow: "hidden"}}>
-                <Carousel3D>
-                    {generateDummyURLs(1).map(img => {
-                        return <img key={img} src={img} />;
-                    })}
-                </Carousel3D>
-            </div>,
-            <div style={{width: 600, overflow: "hidden"}}>
-                <Carousel3D>
-                    {generateDummyURLs(2).map(img => {
-                        return <img key={img} src={img} />;
-                    })}
-                </Carousel3D>
-            </div>,
-            <div style={{width: 600, overflow: "hidden"}}>
-                <Carousel3D>
-                    {generateDummyURLs(3).map(img => {
-                        return <img key={img} src={img} />;
-                    })}
-                </Carousel3D>
-            </div>,
-        ],
-    },
-    {
-        title: "Carousel",
-        showPropsHint: false,
-        components: [
-            <div style={{width: 600, overflow: "hidden"}}>
-                <Carousel>
-                    {generateDummyURLs(3).map(img => {
-                        return <img key={img} src={img} />;
-                    })}
-                </Carousel>
-            </div>,
-        ],
-    },
-];
-
-export const CarouselDemo = () => <DemoHelper groups={groups} />;

package/test/ui-test/src/component/core/CascaderDemo/index.tsx

@@ -1,120 +0,0 @@
-import React, {Children} from "react";
-import type {CascaderDataNode as MultipleCascaderDataNode} from "@pinnacle0/web-ui/core/MultipleCascader";
-import type {CascaderDataNode} from "@pinnacle0/web-ui/core/Cascader";
-import {Cascader} from "@pinnacle0/web-ui/core/Cascader";
-import {MultipleCascader} from "@pinnacle0/web-ui/core/MultipleCascader";
-import {DemoHelper} from "../../DemoHelper";
-import type {DemoHelperGroupConfig} from "../../DemoHelper";
-import {withUncontrolledInitialValue} from "../../../util/withUncontrolledInitialValue";
-
-const NullableCascader = withUncontrolledInitialValue(Cascader.Nullable);
-const InitialNullableCascader = withUncontrolledInitialValue(Cascader.InitialNullable);
-const UncontrolledMultipleCascader = withUncontrolledInitialValue(MultipleCascader);
-
-enum TestEnum {
-    ONE = "ONE",
-    TWO = "TWO",
-    THREE = "THREE",
-    ONE_A = "ONE_A",
-    ONE_B = "ONE_B",
-    ONE_C = "ONE_C",
-    TWO_A = "TWO_A",
-    TWO_B = "TWO_B",
-    TWO_C = "TWO_C",
-    THREE_A = "THREE_A",
-    THREE_B = "THREE_B",
-    THREE_C = "THREE_C",
-}
-
-const cascaderData: Array<CascaderDataNode<TestEnum>> = [
-    {
-        label: TestEnum.ONE,
-        value: TestEnum.ONE,
-        children: [
-            {
-                label: TestEnum.ONE_A,
-                value: TestEnum.ONE_A,
-                children: [
-                    {label: TestEnum.THREE_A, value: TestEnum.THREE_A},
-                    {label: TestEnum.THREE_B, value: TestEnum.THREE_B},
-                    {label: TestEnum.THREE_C, value: TestEnum.THREE_C},
-                ],
-            },
-            {label: TestEnum.ONE_B, value: TestEnum.ONE_B},
-            {label: TestEnum.ONE_C, value: TestEnum.ONE_C},
-        ],
-    },
-    {
-        label: TestEnum.TWO,
-        value: TestEnum.TWO,
-        children: [
-            {label: TestEnum.TWO_A, value: TestEnum.TWO_A},
-            {label: TestEnum.TWO_B, value: TestEnum.TWO_B},
-            {label: TestEnum.TWO_C, value: TestEnum.TWO_C},
-        ],
-    },
-    {
-        label: TestEnum.THREE,
-        value: TestEnum.THREE,
-    },
-];
-
-const multipleCascaderData: Array<MultipleCascaderDataNode<TestEnum>> = [
-    {
-        label: TestEnum.ONE,
-        value: [
-            {
-                label: TestEnum.ONE_A,
-                value: [
-                    {label: TestEnum.THREE_A, value: TestEnum.THREE_A},
-                    {label: TestEnum.THREE_B, value: TestEnum.THREE_B},
-                    {label: TestEnum.THREE_C, value: TestEnum.THREE_C},
-                ],
-            },
-            {label: TestEnum.ONE_B, value: TestEnum.ONE_B},
-            {label: TestEnum.ONE_C, value: TestEnum.ONE_C},
-        ],
-    },
-    {
-        label: TestEnum.TWO,
-        value: [
-            {label: TestEnum.TWO_A, value: TestEnum.TWO_A},
-            {label: TestEnum.TWO_B, value: TestEnum.TWO_B},
-            {label: TestEnum.TWO_C, value: TestEnum.TWO_C},
-        ],
-    },
-    {
-        label: TestEnum.THREE,
-        value: TestEnum.THREE,
-    },
-];
-
-function SimpleCascader() {
-    const [value, setValue] = React.useState(TestEnum.TWO);
-    return <Cascader data={cascaderData} value={value} onChange={setValue} style={{width: 500}} />;
-}
-
-const groups: DemoHelperGroupConfig[] = [
-    {
-        title: "Cascader",
-        showPropsHint: false,
-        components: [<SimpleCascader />],
-    },
-    {
-        title: "Nullable Cascader",
-        showPropsHint: false,
-        components: [<NullableCascader data={cascaderData} initialValue={null} />],
-    },
-    {
-        title: "InitialNullable Cascader",
-        showPropsHint: false,
-        components: [<InitialNullableCascader data={cascaderData} initialValue={null} placeholder="Placeholder here" />],
-    },
-    {
-        title: "Multiple Cascader",
-        showPropsHint: false,
-        components: [<UncontrolledMultipleCascader data={multipleCascaderData} initialValue={[]} placeholder="Placeholder here" />],
-    },
-];
-
-export const CascaderDemo = () => <DemoHelper groups={groups} />;

package/test/ui-test/src/component/core/FoldableDemo.tsx

@@ -1,31 +0,0 @@
-import React from "react";
-import {Foldable} from "@pinnacle0/web-ui/core/Foldable";
-import type {Props as FoldableProps} from "@pinnacle0/web-ui/core/Foldable";
-import type {DemoHelperGroupConfig} from "../DemoHelper";
-import {DemoHelper} from "../DemoHelper";
-
-const ControlledFoldable = (props: Omit<FoldableProps, "expanded" | "onExpansionChange">) => {
-    const [expanded, onExpansionChange] = React.useState<boolean>(false);
-    return <Foldable {...props} expanded={expanded} onExpansionChange={onExpansionChange} />;
-};
-
-const groups: DemoHelperGroupConfig[] = [
-    {
-        title: "Foldable",
-        components: [
-            <ControlledFoldable title="Title1" style={{width: 400}}>
-                <div style={{backgroundColor: "red", height: 150, width: "100%"}} />
-            </ControlledFoldable>,
-            "-",
-            <ControlledFoldable title="Title2" titleRight="TitleRight2" style={{width: 400}}>
-                <div style={{backgroundColor: "green", color: "#eee", width: "100%", padding: 10}}>Lorem ipsum dolor sit amet consectetur adipisicing elit.</div>
-            </ControlledFoldable>,
-            "-",
-            <ControlledFoldable title="Title3" titleRight="TitleRight3" style={{width: 400}}>
-                <div style={{backgroundColor: "blue", height: 150, width: "100%"}} />
-            </ControlledFoldable>,
-        ],
-    },
-];
-
-export const FoldableDemo = () => <DemoHelper groups={groups} />;