{"version":3,"sources":["ProgressiveBlurBackground.tsx"],"sourcesContent":["import { styled } from \"@stitches/react\"\nimport { ControlType, addPropertyControls } from \"framer\"\n\n/**\n * These annotations control how your component sizes\n * Learn more: https://www.framer.com/developers/components/auto-sizing\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */\n\nexport default function ProgressiveBlurBackground({ amount, ...rest }) {\n    const ProgressiveBlur = styled(\"div\", {\n        position: \"absolute\",\n        zIndex: -1,\n        inset: 0,\n        // transform: \"scale(1.2) rotate(180deg)\",\n        transform: \"rotate(180deg)\",\n\n        \".blur\": {\n            position: \"absolute\",\n            inset: 0,\n        },\n\n        \".blur:nth-child(1)\": {\n            zIndex: 1,\n            backdropFilter: `blur(calc(1px * ${amount}))`,\n            maskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 0) 60%)\",\n            WebkitMaskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 0) 60%)\",\n        },\n        \".blur:nth-child(2)\": {\n            zIndex: 2,\n            backdropFilter: `blur(calc(2px * ${amount}))`,\n            maskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 0) 80%)\",\n            WebkitMaskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 0) 80%)\",\n        },\n        \".blur:nth-child(3)\": {\n            zIndex: 3,\n            backdropFilter: `blur(calc(4px * ${amount}))`,\n            maskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%)\",\n            WebkitMaskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%)\",\n        },\n        \".blur:nth-child(4)\": {\n            zIndex: 4,\n            backdropFilter: `blur(calc(8px * ${amount}))`,\n            maskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 1) 100%)\",\n            WebkitMaskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 1) 100%)\",\n        },\n        \".blur:nth-child(5)\": {\n            zIndex: 5,\n            backdropFilter: `blur(calc(16px * ${amount}))`,\n            maskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 1) 100%)\",\n            WebkitMaskImage:\n                \"linear-gradient(to bottom, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 1) 100%)\",\n        },\n    })\n\n    return (\n        <ProgressiveBlur>\n            <div className=\"blur\"></div>\n            <div className=\"blur\"></div>\n            <div className=\"blur\"></div>\n            <div className=\"blur\"></div>\n            <div className=\"blur\"></div>\n        </ProgressiveBlur>\n    )\n}\n\naddPropertyControls(ProgressiveBlurBackground, {\n    amount: {\n        type: ControlType.Number,\n        title: \"Background Blur Level\",\n        defaultValue: 1,\n        min: 0.1,\n        max: 5,\n        step: 0.1,\n        displayStepper: true,\n    },\n})\n"],"names":[],"mappings":"yDAAA,OAAS,MAAM,KAAQ,kBAAiB,AACxC,OAAS,WAAW,CAAE,mBAAmB,KAAQ,SAAQ,AAEzD;;;;;;CAMC,EAED,eAAe,SAAS,0BAA0B,CAAE,MAAM,CAAE,GAAG,KAAM,EACjE,MAAM,gBAAkB,OAAO,MAAO,CAClC,SAAU,WACV,OAAQ,CAAC,EACT,MAAO,EACP,0CAA0C;AAC1C,UAAW,iBAEX,QAAS,CACL,SAAU,WACV,MAAO,CACX,EAEA,qBAAsB,CAClB,OAAQ,EACR,eAAgB,CAAC,gBAAgB,EAAE,OAAO,EAAE,CAAC,CAC7C,UACI,oHACJ,gBACI,mHACR,EACA,qBAAsB,CAClB,OAAQ,EACR,eAAgB,CAAC,gBAAgB,EAAE,OAAO,EAAE,CAAC,CAC7C,UACI,qHACJ,gBACI,oHACR,EACA,qBAAsB,CAClB,OAAQ,EACR,eAAgB,CAAC,gBAAgB,EAAE,OAAO,EAAE,CAAC,CAC7C,UACI,sHACJ,gBACI,qHACR,EACA,qBAAsB,CAClB,OAAQ,EACR,eAAgB,CAAC,gBAAgB,EAAE,OAAO,EAAE,CAAC,CAC7C,UACI,gGACJ,gBACI,+FACR,EACA,qBAAsB,CAClB,OAAQ,EACR,eAAgB,CAAC,iBAAiB,EAAE,OAAO,EAAE,CAAC,CAC9C,UACI,0EACJ,gBACI,yEACR,CACJ,GAEA,oBACI,MAAC,wCACG,KAAC,OAAI,UAAU,sBACf,KAAC,OAAI,UAAU,sBACf,KAAC,OAAI,UAAU,sBACf,KAAC,OAAI,UAAU,sBACf,KAAC,OAAI,UAAU,YAG3B,CAEA,oBAAoB,0BAA2B,CAC3C,OAAQ,CACJ,KAAM,YAAY,MAAM,CACxB,MAAO,wBACP,aAAc,EACd,IAAK,GACL,IAAK,EACL,KAAM,GACN,eAAgB,IACpB,CACJ"}