@zap-wunschlachen/wl-shared-components 1.0.16 → 1.0.18

package/heroicons.ts

@@ -1,75 +1,75 @@
-import { h } from 'vue';
-import * as HeroIcons from '@heroicons/vue/24/outline'; // Heroicons solid icons
-import type { IconSet, IconProps } from 'vuetify';
-
-// Import multiple custom SVG components
-import Outline from './src/components/Icons/checkbox.vue';
-import OutlineChecked from './src/components/Icons/outlineChecked.vue';
-import Circle from './src/components/Icons/Circle.vue';
-import Calender from './src/components/Icons/calendar.vue';
-import CalendarNotification from './src/components/Icons/CalendarNotification.vue';
-import Chair from './src/components/Icons/Chair.vue';
-import ChairNotification from './src/components/Icons/ChairNotification.vue';
-import Group3 from './src/components/Icons/Group3.vue';
-import RingNotification from './src/components/Icons/RingNotification.vue';
-import SolidArrowRight from './src/components/Icons/SolidArrowRight.vue';
-import FilledCircle from './src/components/Icons/FilledCircle.vue';
-import FavIcon from './src/components/Icons/FavIcon.vue';
-
-// Register custom SVG icons in an object
-const customIcons: Record<string, typeof Outline> = {
-  Outline,
-  OutlineChecked,
-  Circle,
-  Calender,
-  CalendarNotification,
-  Chair,
-  ChairNotification,
-  Group3,
-  RingNotification,
-  SolidArrowRight,
-  FilledCircle,
-  FavIcon,
-};
-
-const heroicons: IconSet = {
-  component: (props: IconProps) => {
-    let { icon, ...rest } = props;
-
-    if (typeof icon === 'string') {
-      // Convert icon name to PascalCase for custom icons
-      const PascalCaseIconName = icon
-        .split('-')
-        .map((chunk) => chunk.charAt(0).toUpperCase() + chunk.slice(1))
-        .join('');
-
-      const CustomIconComponent =
-        customIcons[PascalCaseIconName as keyof typeof customIcons];
-
-      if (CustomIconComponent) {
-        // Render the custom icon if found
-        return h(CustomIconComponent, rest);
-      }
-
-      // Otherwise, check for Heroicons
-      if (icon.startsWith('heroicons-')) {
-        icon = icon.replace('heroicons-', '');
-      }
-
-      const HeroIconComponent = (HeroIcons as any)[`${PascalCaseIconName}Icon`];
-
-      if (HeroIconComponent) {
-        // Render Heroicon if found
-        return h(HeroIconComponent, rest);
-      }
-
-      console.warn(`Icon "${icon}" not found.`);
-    } else {
-      console.warn('Icon value is not a string:', icon);
-    }
-
-    return null;
-  },
-};
-
-export default heroicons;
+import { h } from 'vue';
+import * as HeroIcons from '@heroicons/vue/24/outline'; // Heroicons solid icons
+import type { IconSet, IconProps } from 'vuetify';
+
+// Import multiple custom SVG components
+import Outline from './src/components/Icons/checkbox.vue';
+import OutlineChecked from './src/components/Icons/outlineChecked.vue';
+import Circle from './src/components/Icons/Circle.vue';
+import Calender from './src/components/Icons/calendar.vue';
+import CalendarNotification from './src/components/Icons/CalendarNotification.vue';
+import Chair from './src/components/Icons/Chair.vue';
+import ChairNotification from './src/components/Icons/ChairNotification.vue';
+import Group3 from './src/components/Icons/Group3.vue';
+import RingNotification from './src/components/Icons/RingNotification.vue';
+import SolidArrowRight from './src/components/Icons/SolidArrowRight.vue';
+import FilledCircle from './src/components/Icons/FilledCircle.vue';
+import FavIcon from './src/components/Icons/FavIcon.vue';
+
+// Register custom SVG icons in an object
+const customIcons: Record<string, typeof Outline> = {
+  Outline,
+  OutlineChecked,
+  Circle,
+  Calender,
+  CalendarNotification,
+  Chair,
+  ChairNotification,
+  Group3,
+  RingNotification,
+  SolidArrowRight,
+  FilledCircle,
+  FavIcon,
+};
+
+const heroicons: IconSet = {
+  component: (props: IconProps) => {
+    let { icon, ...rest } = props;
+
+    if (typeof icon === 'string') {
+      // Convert icon name to PascalCase for custom icons
+      const PascalCaseIconName = icon
+        .split('-')
+        .map((chunk) => chunk.charAt(0).toUpperCase() + chunk.slice(1))
+        .join('');
+
+      const CustomIconComponent =
+        customIcons[PascalCaseIconName as keyof typeof customIcons];
+
+      if (CustomIconComponent) {
+        // Render the custom icon if found
+        return h(CustomIconComponent, rest);
+      }
+
+      // Otherwise, check for Heroicons
+      if (icon.startsWith('heroicons-')) {
+        icon = icon.replace('heroicons-', '');
+      }
+
+      const HeroIconComponent = (HeroIcons as any)[`${PascalCaseIconName}Icon`];
+
+      if (HeroIconComponent) {
+        // Render Heroicon if found
+        return h(HeroIconComponent, rest);
+      }
+
+      console.warn(`Icon "${icon}" not found.`);
+    } else {
+      console.warn('Icon value is not a string:', icon);
+    }
+
+    return null;
+  },
+};
+
+export default heroicons;

package/index.html

@@ -1,19 +1,19 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>My Vite App</title>
-
-    <!-- Add the link to the Google Font or custom font here -->
-    <link
-      href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;700&display=swap"
-      rel="stylesheet"
-    />
-  </head>
-  <body>
-    <div id="app"></div>
-
-    <script type="module" src="/src/main.ts"></script>
-  </body>
-</html>
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>My Vite App</title>
+
+    <!-- Add the link to the Google Font or custom font here -->
+    <link
+      href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;700&display=swap"
+      rel="stylesheet"
+    />
+  </head>
+  <body>
+    <div id="app"></div>
+
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

package/package.json

@@ -1,67 +1,67 @@
-{
-  "name": "@zap-wunschlachen/wl-shared-components",
-  "version": "1.0.16",
-  "type": "module",
-  "scripts": {
-    "dev": "vite",
-    "dev host": "vite --host",
-    "build": "tsc && vite build",
-    "preview": "vite preview",
-    "storybook": "storybook dev -p 7000",
-    "build-storybook": "storybook build",
-    "test": "vitest",
-    "test:ui-vitest": "vitest --ui",
-    "test:unit": "vitest run",
-    "test:unit:watch": "vitest watch",
-    "test:coverage": "vitest run --coverage",
-    "test:e2e": "playwright test",
-    "test:e2e:headed": "playwright test --headed",
-    "test:e2e:ui": "playwright test --ui",
-    "test:e2e:report": "playwright show-report",
-    "test:e2e:update-snapshots": "playwright test tests/e2e/visual-regression.spec.ts --update-snapshots"
-  },
-  "devDependencies": {
-    "@axe-core/playwright": "^4.10.2",
-    "@chromatic-com/storybook": "^1.9.0",
-    "@playwright/test": "^1.55.0",
-    "@storybook/addon-actions": "^8.3.5",
-    "@storybook/addon-docs": "^8.3.6",
-    "@storybook/addon-essentials": "^8.3.6",
-    "@storybook/addon-interactions": "^8.3.5",
-    "@storybook/addon-links": "^8.3.5",
-    "@storybook/addon-onboarding": "^8.3.5",
-    "@storybook/blocks": "^8.3.5",
-    "@storybook/test": "^8.3.5",
-    "@storybook/vue3": "^8.3.5",
-    "@storybook/vue3-vite": "^8.3.5",
-    "@testing-library/user-event": "^14.6.1",
-    "@testing-library/vue": "^8.1.0",
-    "@vitest/coverage-v8": "^3.2.4",
-    "@vitest/ui": "^3.2.4",
-    "@vue/test-utils": "^2.4.6",
-    "concurrently": "^9.2.1",
-    "happy-dom": "^18.0.1",
-    "http-server": "^14.1.1",
-    "playwright": "^1.55.0",
-    "prettier": "^3.3.1",
-    "storybook": "^8.3.5",
-    "typescript": "^5.2.2",
-    "vite": "^5.2.0",
-    "vitest": "^3.2.4",
-    "vue": "^3.5.11",
-    "wait-on": "^8.0.4"
-  },
-  "dependencies": {
-    "@heroicons/vue": "^2.1.5",
-    "@mdi/font": "^7.4.47",
-    "@vitejs/plugin-vue": "^5.1.4",
-    "date-fns": "^4.1.0",
-    "flag-icons": "^7.5.0",
-    "v-phone-input": "^5.1.0",
-    "vue-i18n": "^11.1.11",
-    "wavesurfer.js": "^7.9.9"
-  },
-  "peerDependencies": {
-    "vuetify": "^3.7.15"
-  }
-}
+{
+  "name": "@zap-wunschlachen/wl-shared-components",
+  "version": "1.0.18",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "dev host": "vite --host",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 7000",
+    "build-storybook": "storybook build",
+    "test": "vitest",
+    "test:ui-vitest": "vitest --ui",
+    "test:unit": "vitest run",
+    "test:unit:watch": "vitest watch",
+    "test:coverage": "vitest run --coverage",
+    "test:e2e": "playwright test",
+    "test:e2e:headed": "playwright test --headed",
+    "test:e2e:ui": "playwright test --ui",
+    "test:e2e:report": "playwright show-report",
+    "test:e2e:update-snapshots": "playwright test tests/e2e/visual-regression.spec.ts --update-snapshots"
+  },
+  "devDependencies": {
+    "@axe-core/playwright": "^4.10.2",
+    "@chromatic-com/storybook": "^1.9.0",
+    "@playwright/test": "^1.55.0",
+    "@storybook/addon-actions": "^8.3.5",
+    "@storybook/addon-docs": "^8.3.6",
+    "@storybook/addon-essentials": "^8.3.6",
+    "@storybook/addon-interactions": "^8.3.5",
+    "@storybook/addon-links": "^8.3.5",
+    "@storybook/addon-onboarding": "^8.3.5",
+    "@storybook/blocks": "^8.3.5",
+    "@storybook/test": "^8.3.5",
+    "@storybook/vue3": "^8.3.5",
+    "@storybook/vue3-vite": "^8.3.5",
+    "@testing-library/user-event": "^14.6.1",
+    "@testing-library/vue": "^8.1.0",
+    "@vitest/coverage-v8": "^3.2.4",
+    "@vitest/ui": "^3.2.4",
+    "@vue/test-utils": "^2.4.6",
+    "concurrently": "^9.2.1",
+    "happy-dom": "^18.0.1",
+    "http-server": "^14.1.1",
+    "playwright": "^1.55.0",
+    "prettier": "^3.3.1",
+    "storybook": "^8.3.5",
+    "typescript": "^5.2.2",
+    "vite": "^5.2.0",
+    "vitest": "^3.2.4",
+    "vue": "^3.5.11",
+    "wait-on": "^8.0.4"
+  },
+  "dependencies": {
+    "@heroicons/vue": "^2.1.5",
+    "@mdi/font": "^7.4.47",
+    "@vitejs/plugin-vue": "^5.1.4",
+    "date-fns": "^4.1.0",
+    "flag-icons": "^7.5.0",
+    "v-phone-input": "^5.1.0",
+    "vue-i18n": "^11.1.11",
+    "wavesurfer.js": "^7.9.9"
+  },
+  "peerDependencies": {
+    "vuetify": "^3.7.15"
+  }
+}

package/playwright.config.ts

@@ -1,48 +1,48 @@
-import { defineConfig, devices } from '@playwright/test';
-
-export default defineConfig({
-  testDir: './tests/e2e',
-  fullyParallel: false,
-  forbidOnly: !!process.env.CI,
-  retries: process.env.CI ? 2 : 0,
-  workers: process.env.CI ? 1 : undefined,
-  reporter: [
-    ['list'],
-    ['html', { outputFolder: 'playwright-report', open: 'never' }],
-  ],
-  timeout: 60000,
-  use: {
-    baseURL: 'http://localhost:7000',
-    trace: 'on-first-retry',
-    screenshot: 'only-on-failure',
-    actionTimeout: 15000,
-    navigationTimeout: 30000,
-  },
-  expect: {
-    timeout: 15000,
-
-    toHaveScreenshot: {
-      pathTemplate: '{testDir}/snapshots/{testFileName}/{platform}/{projectName}/{arg}{ext}',
-      threshold: 0.01,
-      maxDiffPixelRatio: 0.10,
-    }
-  },
-
-  projects: [
-    {
-      name: 'chromium',
-      use: { ...devices['Desktop Chrome'] },
-    },
-    { name: 'firefox', use: { ...devices['Desktop Firefox'] } },
-    { name: 'webkit', use: { ...devices['Desktop Safari'] } },
-    { name: 'Mobile Chrome', use: { ...devices['Pixel 9'] } },
-    { name: 'Mobile Safari', use: { ...devices['iPhone 16'] } },
-  ],
-
-  webServer: {
-    command: 'npm run storybook',
-    url: 'http://localhost:7000',
-    reuseExistingServer: true,
-    timeout: 120 * 1000,
-  },
-});
+import { defineConfig, devices } from '@playwright/test';
+
+export default defineConfig({
+  testDir: './tests/e2e',
+  fullyParallel: false,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+  reporter: [
+    ['list'],
+    ['html', { outputFolder: 'playwright-report', open: 'never' }],
+  ],
+  timeout: 60000,
+  use: {
+    baseURL: 'http://localhost:7000',
+    trace: 'on-first-retry',
+    screenshot: 'only-on-failure',
+    actionTimeout: 15000,
+    navigationTimeout: 30000,
+  },
+  expect: {
+    timeout: 15000,
+
+    toHaveScreenshot: {
+      pathTemplate: '{testDir}/snapshots/{testFileName}/{platform}/{projectName}/{arg}{ext}',
+      threshold: 0.01,
+      maxDiffPixelRatio: 0.10,
+    }
+  },
+
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
+    { name: 'firefox', use: { ...devices['Desktop Firefox'] } },
+    { name: 'webkit', use: { ...devices['Desktop Safari'] } },
+    { name: 'Mobile Chrome', use: { ...devices['Pixel 9'] } },
+    { name: 'Mobile Safari', use: { ...devices['iPhone 16'] } },
+  ],
+
+  webServer: {
+    command: 'npm run storybook',
+    url: 'http://localhost:7000',
+    reuseExistingServer: true,
+    timeout: 120 * 1000,
+  },
+});

package/public/background.svg

@@ -1,60 +1,60 @@
-<svg width="1920" height="494" viewBox="0 0 1920 494" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g filter="url(#filter0_b_201_11645)">
-        <path d="M-555.158 -935.552L206.014 299.32C272.103 406.538 412.596 439.88 519.815 373.791L1754.69 -387.38C1861.9 -453.469 1895.25 -593.963 1829.16 -701.181L1067.99 -1936.05C1001.9 -2043.27 861.404 -2076.61 754.186 -2010.52L-480.686 -1249.35C-587.905 -1183.26 -621.247 -1042.77 -555.158 -935.552Z" fill="url(#paint0_linear_201_11645)"/>
-    </g>
-    <g filter="url(#filter1_b_201_11645)">
-        <path d="M-365.85 -978.718L155.699 157.844C200.984 256.531 317.698 299.822 416.385 254.536L1552.95 -267.013C1651.63 -312.299 1694.93 -429.012 1649.64 -527.699L1128.09 -1664.26C1082.81 -1762.95 966.092 -1806.24 867.404 -1760.95L-269.158 -1239.4C-367.845 -1194.12 -411.136 -1077.41 -365.85 -978.718Z" fill="url(#paint1_linear_201_11645)"/>
-    </g>
-    <g filter="url(#filter2_b_201_11645)">
-        <path d="M-199.592 -995.206L127.265 32.0959C155.644 121.29 250.956 170.59 340.15 142.211L1367.45 -184.646C1456.65 -213.025 1505.95 -308.337 1477.57 -397.531L1150.71 -1424.83C1122.33 -1514.03 1027.02 -1563.33 937.825 -1534.95L-89.4769 -1208.09C-178.671 -1179.71 -227.971 -1084.4 -199.592 -995.206Z" fill="url(#paint2_linear_201_11645)"/>
-    </g>
-    <g filter="url(#filter3_b_201_11645)">
-        <path d="M-55.5683 -991.823L116.176 -78.4863C131.088 0.816985 207.465 53.0162 286.768 38.104L1200.1 -133.64C1279.41 -148.552 1331.61 -224.929 1316.7 -304.232L1144.95 -1217.57C1130.04 -1296.87 1053.66 -1349.07 974.359 -1334.16L61.022 -1162.42C-18.2812 -1147.5 -70.4805 -1071.13 -55.5683 -991.823Z" fill="url(#paint3_linear_201_11645)"/>
-    </g>
-    <defs>
-        <filter id="filter0_b_201_11645" x="-594.982" y="-2050.35" width="2463.96" height="2463.96" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
-            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
-        </filter>
-        <filter id="filter1_b_201_11645" x="-389.688" y="-1784.79" width="2063.16" height="2063.16" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
-            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
-        </filter>
-        <filter id="filter2_b_201_11645" x="-213.49" y="-1548.85" width="1704.95" height="1704.95" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
-            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
-        </filter>
-        <filter id="filter3_b_201_11645" x="-63.986" y="-1342.58" width="1389.1" height="1389.1" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
-            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
-            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
-        </filter>
-        <linearGradient id="paint0_linear_201_11645" x1="850.924" y1="-972.878" x2="1824.39" y2="-447.912" gradientUnits="userSpaceOnUse">
-            <stop stop-color="#19191C" stop-opacity="0"/>
-            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
-            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
-        </linearGradient>
-        <linearGradient id="paint1_linear_201_11645" x1="841.17" y1="-862.941" x2="1618.95" y2="-311.486" gradientUnits="userSpaceOnUse">
-            <stop stop-color="#19191C" stop-opacity="0"/>
-            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
-            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
-        </linearGradient>
-        <linearGradient id="paint2_linear_201_11645" x1="821.024" y1="-769.324" x2="1428.59" y2="-215.763" gradientUnits="userSpaceOnUse">
-            <stop stop-color="#19191C" stop-opacity="0"/>
-            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
-            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
-        </linearGradient>
-        <linearGradient id="paint3_linear_201_11645" x1="793.987" y1="-691.327" x2="1255.7" y2="-153.842" gradientUnits="userSpaceOnUse">
-            <stop stop-color="#19191C" stop-opacity="0"/>
-            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
-            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
-        </linearGradient>
-    </defs>
-</svg>
+<svg width="1920" height="494" viewBox="0 0 1920 494" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g filter="url(#filter0_b_201_11645)">
+        <path d="M-555.158 -935.552L206.014 299.32C272.103 406.538 412.596 439.88 519.815 373.791L1754.69 -387.38C1861.9 -453.469 1895.25 -593.963 1829.16 -701.181L1067.99 -1936.05C1001.9 -2043.27 861.404 -2076.61 754.186 -2010.52L-480.686 -1249.35C-587.905 -1183.26 -621.247 -1042.77 -555.158 -935.552Z" fill="url(#paint0_linear_201_11645)"/>
+    </g>
+    <g filter="url(#filter1_b_201_11645)">
+        <path d="M-365.85 -978.718L155.699 157.844C200.984 256.531 317.698 299.822 416.385 254.536L1552.95 -267.013C1651.63 -312.299 1694.93 -429.012 1649.64 -527.699L1128.09 -1664.26C1082.81 -1762.95 966.092 -1806.24 867.404 -1760.95L-269.158 -1239.4C-367.845 -1194.12 -411.136 -1077.41 -365.85 -978.718Z" fill="url(#paint1_linear_201_11645)"/>
+    </g>
+    <g filter="url(#filter2_b_201_11645)">
+        <path d="M-199.592 -995.206L127.265 32.0959C155.644 121.29 250.956 170.59 340.15 142.211L1367.45 -184.646C1456.65 -213.025 1505.95 -308.337 1477.57 -397.531L1150.71 -1424.83C1122.33 -1514.03 1027.02 -1563.33 937.825 -1534.95L-89.4769 -1208.09C-178.671 -1179.71 -227.971 -1084.4 -199.592 -995.206Z" fill="url(#paint2_linear_201_11645)"/>
+    </g>
+    <g filter="url(#filter3_b_201_11645)">
+        <path d="M-55.5683 -991.823L116.176 -78.4863C131.088 0.816985 207.465 53.0162 286.768 38.104L1200.1 -133.64C1279.41 -148.552 1331.61 -224.929 1316.7 -304.232L1144.95 -1217.57C1130.04 -1296.87 1053.66 -1349.07 974.359 -1334.16L61.022 -1162.42C-18.2812 -1147.5 -70.4805 -1071.13 -55.5683 -991.823Z" fill="url(#paint3_linear_201_11645)"/>
+    </g>
+    <defs>
+        <filter id="filter0_b_201_11645" x="-594.982" y="-2050.35" width="2463.96" height="2463.96" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
+            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
+            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
+        </filter>
+        <filter id="filter1_b_201_11645" x="-389.688" y="-1784.79" width="2063.16" height="2063.16" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
+            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
+            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
+        </filter>
+        <filter id="filter2_b_201_11645" x="-213.49" y="-1548.85" width="1704.95" height="1704.95" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
+            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
+            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
+        </filter>
+        <filter id="filter3_b_201_11645" x="-63.986" y="-1342.58" width="1389.1" height="1389.1" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+            <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.93731"/>
+            <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_201_11645"/>
+            <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_201_11645" result="shape"/>
+        </filter>
+        <linearGradient id="paint0_linear_201_11645" x1="850.924" y1="-972.878" x2="1824.39" y2="-447.912" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#19191C" stop-opacity="0"/>
+            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
+            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
+        </linearGradient>
+        <linearGradient id="paint1_linear_201_11645" x1="841.17" y1="-862.941" x2="1618.95" y2="-311.486" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#19191C" stop-opacity="0"/>
+            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
+            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
+        </linearGradient>
+        <linearGradient id="paint2_linear_201_11645" x1="821.024" y1="-769.324" x2="1428.59" y2="-215.763" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#19191C" stop-opacity="0"/>
+            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
+            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
+        </linearGradient>
+        <linearGradient id="paint3_linear_201_11645" x1="793.987" y1="-691.327" x2="1255.7" y2="-153.842" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#19191C" stop-opacity="0"/>
+            <stop offset="0.33" stop-color="#129CFF" stop-opacity="0.15"/>
+            <stop offset="0.9" stop-color="#00D1FF" stop-opacity="0.55"/>
+        </linearGradient>
+    </defs>
+</svg>