import { _ as __assign, b as __makeTemplateObject } from '../tslib.es6-faad35dc.js';
import { jsx } from 'react/jsx-runtime';
import { styled } from '@mui/material/styles';
import MuiBox from '@mui/material/Box';
import Dots from '../components/Dots.js';
import ParallaxBox from '../components/ParallaxBox.js';
import 'react';
import 'react-dom';

var argTypes = {
    inverted: {
        name: "inverted",
        defaultValue: false,
        control: {
            type: "boolean"
        },
        table: {
            type: { summary: "boolean" },
            defaultValue: { summary: false }
        }
    },
    size: {
        name: "size",
        defaultValue: 88,
        control: {
            type: "number"
        },
        table: {
            type: { summary: "number" },
            defaultValue: { summary: 88 }
        }
    },
    rotate: {
        name: "rotate",
        defaultValue: 0,
        control: {
            type: "number"
        },
        table: {
            type: { summary: "number" },
            defaultValue: { summary: 0 }
        }
    }
};
var DefaultTemplate = function (args) {
    return jsx(Dots, __assign({}, args), void 0);
};
var ParallaxTemplate = function (args) {
    var DotsParallaxBox = styled(ParallaxBox)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    ", "\n  "], ["\n    ", "\n  "])), function () { return ({
        position: "absolute",
        left: "10%",
        top: "10%",
        zIndex: -1
    }); });
    return (jsx(MuiBox, __assign({ position: "relative", width: "50vw", height: "200vh" }, { children: jsx(DotsParallaxBox, __assign({ depth: 0.5 }, { children: jsx(Dots, __assign({}, args), void 0) }), void 0) }), void 0));
};
var Default = DefaultTemplate.bind({});
var Parallax = ParallaxTemplate.bind({});
var Dots_stories = {
    title: "Components/Dots",
    component: Dots,
    argTypes: argTypes
};
var templateObject_1;

export { Default, Parallax, Dots_stories as default };
