zyflow 0.6.4

package/.shadcn-admin-ref/src/assets/brand-icons/icon-slack.tsx

@@ -0,0 +1,28 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+
+export function IconSlack({ className, ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      role='img'
+      viewBox='0 0 24 24'
+      xmlns='http://www.w3.org/2000/svg'
+      width='24'
+      height='24'
+      className={cn('[&>path]:stroke-current', className)}
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='2'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...props}
+    >
+      <title>Slack</title>
+      <path strokeWidth='0' d='M0 0h24v24H0z' fill='none' />
+      <path d='M12 12v-6a2 2 0 0 1 4 0v6m0 -2a2 2 0 1 1 2 2h-6' />
+      <path d='M12 12h6a2 2 0 0 1 0 4h-6m2 0a2 2 0 1 1 -2 2v-6' />
+      <path d='M12 12v6a2 2 0 0 1 -4 0v-6m0 2a2 2 0 1 1 -2 -2h6' />
+      <path d='M12 12h-6a2 2 0 0 1 0 -4h6m-2 0a2 2 0 1 1 2 -2v6' />
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/brand-icons/icon-stripe.tsx

@@ -0,0 +1,25 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+
+export function IconStripe({ className, ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      role='img'
+      viewBox='0 0 24 24'
+      xmlns='http://www.w3.org/2000/svg'
+      width='24'
+      height='24'
+      className={cn('[&>path]:stroke-current', className)}
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='2'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...props}
+    >
+      <title>Stripe</title>
+      <path strokeWidth='0' d='M0 0h24v24H0z' fill='none' />
+      <path d='M11.453 8.056c0 -.623 .518 -.979 1.442 -.979c1.69 0 3.41 .343 4.605 .923l.5 -4c-.948 -.449 -2.82 -1 -5.5 -1c-1.895 0 -3.373 .087 -4.5 1c-1.172 .956 -2 2.33 -2 4c0 3.03 1.958 4.906 5 6c1.961 .69 3 .743 3 1.5c0 .735 -.851 1.5 -2 1.5c-1.423 0 -3.963 -.609 -5.5 -1.5l-.5 4c1.321 .734 3.474 1.5 6 1.5c2 0 3.957 -.468 5.084 -1.36c1.263 -.979 1.916 -2.268 1.916 -4.14c0 -3.096 -1.915 -4.547 -5 -5.637c-1.646 -.605 -2.544 -1.07 -2.544 -1.807z' />
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/brand-icons/icon-telegram.tsx

@@ -0,0 +1,25 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+
+export function IconTelegram({ className, ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      role='img'
+      viewBox='0 0 24 24'
+      xmlns='http://www.w3.org/2000/svg'
+      width='24'
+      height='24'
+      className={cn('[&>path]:stroke-current', className)}
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='2'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...props}
+    >
+      <title>Telegram</title>
+      <path strokeWidth='0' d='M0 0h24v24H0z' fill='none' />
+      <path d='M15 10l-4 4l6 6l4 -16l-18 7l4 2l2 6l3 -4' />
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/brand-icons/icon-trello.tsx

@@ -0,0 +1,27 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+
+export function IconTrello({ className, ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      role='img'
+      viewBox='0 0 24 24'
+      xmlns='http://www.w3.org/2000/svg'
+      width='24'
+      height='24'
+      className={cn('[&>path]:stroke-current', className)}
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='2'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...props}
+    >
+      <title>Trello</title>
+      <path strokeWidth='0' d='M0 0h24v24H0z' fill='none' />
+      <path d='M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z' />
+      <path d='M7 7h3v10h-3z' />
+      <path d='M14 7h3v6h-3z' />
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/brand-icons/icon-whatsapp.tsx

@@ -0,0 +1,26 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+
+export function IconWhatsapp({ className, ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      role='img'
+      viewBox='0 0 24 24'
+      xmlns='http://www.w3.org/2000/svg'
+      width='24'
+      height='24'
+      className={cn('[&>path]:stroke-current', className)}
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='2'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...props}
+    >
+      <title>WhatsApp</title>
+      <path strokeWidth='0' d='M0 0h24v24H0z' fill='none' />
+      <path d='M3 21l1.65 -3.8a9 9 0 1 1 3.4 2.9l-5.05 .9' />
+      <path d='M9 10a.5 .5 0 0 0 1 0v-1a.5 .5 0 0 0 -1 0v1a5 5 0 0 0 5 5h1a.5 .5 0 0 0 0 -1h-1a.5 .5 0 0 0 0 1' />
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/brand-icons/icon-zoom.tsx

@@ -0,0 +1,26 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+
+export function IconZoom({ className, ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      role='img'
+      viewBox='0 0 24 24'
+      xmlns='http://www.w3.org/2000/svg'
+      width='24'
+      height='24'
+      className={cn('[&>path]:stroke-current', className)}
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='2'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...props}
+    >
+      <title>Zoom</title>
+      <path strokeWidth='0' d='M0 0h24v24H0z' fill='none' />
+      <path d='M17.011 9.385v5.128l3.989 3.487v-12z' />
+      <path d='M3.887 6h10.08c1.468 0 3.033 1.203 3.033 2.803v8.196a.991 .991 0 0 1 -.975 1h-10.373c-1.667 0 -2.652 -1.5 -2.652 -3l.01 -8a.882 .882 0 0 1 .208 -.71a.841 .841 0 0 1 .67 -.287z' />
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/brand-icons/index.ts

@@ -0,0 +1,16 @@
+export { IconDiscord } from './icon-discord'
+export { IconDocker } from './icon-docker'
+export { IconFacebook } from './icon-facebook'
+export { IconFigma } from './icon-figma'
+export { IconGithub } from './icon-github'
+export { IconGitlab } from './icon-gitlab'
+export { IconGmail } from './icon-gmail'
+export { IconMedium } from './icon-medium'
+export { IconNotion } from './icon-notion'
+export { IconSkype } from './icon-skype'
+export { IconSlack } from './icon-slack'
+export { IconStripe } from './icon-stripe'
+export { IconTelegram } from './icon-telegram'
+export { IconTrello } from './icon-trello'
+export { IconWhatsapp } from './icon-whatsapp'
+export { IconZoom } from './icon-zoom'

package/.shadcn-admin-ref/src/assets/clerk-full-logo.tsx

@@ -0,0 +1,41 @@
+import { type SVGProps } from 'react'
+
+export function ClerkFullLogo(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width={77}
+      height={24}
+      viewBox='0 0 77 24'
+      fill='none'
+      xmlns='http://www.w3.org/2000/svg'
+      {...props}
+    >
+      <path
+        d='M35.148 16.738a4.198 4.198 0 01-3.06 1.283 3.53 3.53 0 01-2.604-1.034c-.619-.645-.975-1.566-.975-2.665 0-2.199 1.432-3.703 3.58-3.703a3.914 3.914 0 013.034 1.377l1.859-1.644c-1.211-1.47-3.176-2.229-5.042-2.229-3.652 0-6.24 2.517-6.24 6.22 0 1.831.643 3.374 1.728 4.463s2.631 1.728 4.415 1.728c2.317 0 4.166-.94 5.203-2.122l-1.898-1.674zM38.727 3.428h2.766V20.34h-2.766V3.428zM54.818 15.283c.046-.368.07-.74.076-1.11 0-3.507-2.296-6.047-5.847-6.047a5.738 5.738 0 00-4.215 1.725c-1.038 1.089-1.66 2.631-1.66 4.47 0 3.749 2.642 6.216 6.146 6.216 2.35 0 4.043-.951 5.058-2.242l-1.812-1.605-.09-.076a3.749 3.749 0 01-3.008 1.406c-1.778 0-3.061-1.037-3.427-2.737h8.779zm-8.733-2.22a3.365 3.365 0 01.737-1.449 3.082 3.082 0 012.368-.996c1.58 0 2.57.988 2.911 2.445h-6.016zM63.445 8.09v3.084a13.36 13.36 0 00-.838-.05c-2.094 0-3.282 1.505-3.282 3.479v5.736h-2.763V8.261h2.763v1.83h.025c.938-1.283 2.284-1.997 3.75-1.997l.345-.004zM69.887 15.281l-1.998 2.222v2.837h-2.764V3.428h2.764v10.374L72.822 8.3h3.283l-4.341 4.86 4.417 7.18h-3.11l-3.133-5.059h-.051z'
+        fill='#1F0256'
+      />
+      <path
+        d='M19.116 3.16l-2.88 2.881a.571.571 0 01-.701.084 6.854 6.854 0 00-10.39 5.647 6.867 6.867 0 00.979 3.764.571.571 0 01-.084.699l-2.88 2.88a.57.57 0 01-.865-.063A11.994 11.994 0 0119.051 2.295a.57.57 0 01.065.866z'
+        fill='url(#paint0_linear_26568_214324)'
+      />
+      <path
+        d='M19.113 20.829l-2.88-2.88a.571.571 0 00-.7-.085 6.854 6.854 0 01-7.081 0 .571.571 0 00-.7.084l-2.881 2.88a.57.57 0 00.062.877 11.994 11.994 0 0014.114 0 .571.571 0 00.066-.876zM11.997 15.422a3.427 3.427 0 100-6.854 3.427 3.427 0 000 6.854z'
+        fill='#1F0256'
+      />
+      <defs>
+        <linearGradient
+          id='paint0_linear_26568_214324'
+          x1={16.4087}
+          y1={-1.75881}
+          x2={-7.88473}
+          y2={22.5365}
+          gradientUnits='userSpaceOnUse'
+        >
+          <stop stopColor='#17CCFC' />
+          <stop offset={0.5} stopColor='#5D31FF' />
+          <stop offset={1} stopColor='#F35AFF' />
+        </linearGradient>
+      </defs>
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/clerk-logo.tsx

@@ -0,0 +1,23 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+
+export function ClerkLogo({ className, ...props }: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      role='img'
+      viewBox='0 0 24 24'
+      xmlns='http://www.w3.org/2000/svg'
+      id='clerk'
+      height='24'
+      width='24'
+      className={cn('[&>path]:fill-foreground', className)}
+      {...props}
+    >
+      <title>Clerk</title>
+      <path
+        d='m21.47 20.829 -2.881 -2.881a0.572 0.572 0 0 0 -0.7 -0.084 6.854 6.854 0 0 1 -7.081 0 0.576 0.576 0 0 0 -0.7 0.084l-2.881 2.881a0.576 0.576 0 0 0 -0.103 0.69 0.57 0.57 0 0 0 0.166 0.186 12 12 0 0 0 14.113 0 0.58 0.58 0 0 0 0.239 -0.423 0.576 0.576 0 0 0 -0.172 -0.453Zm0.002 -17.668 -2.88 2.88a0.569 0.569 0 0 1 -0.701 0.084A6.857 6.857 0 0 0 8.724 8.08a6.862 6.862 0 0 0 -1.222 3.692 6.86 6.86 0 0 0 0.978 3.764 0.573 0.573 0 0 1 -0.083 0.699l-2.881 2.88a0.567 0.567 0 0 1 -0.864 -0.063A11.993 11.993 0 0 1 6.771 2.7a11.99 11.99 0 0 1 14.637 -0.405 0.566 0.566 0 0 1 0.232 0.418 0.57 0.57 0 0 1 -0.168 0.448Zm-7.118 12.261a3.427 3.427 0 1 0 0 -6.854 3.427 3.427 0 0 0 0 6.854Z'
+        strokeWidth='1'
+      ></path>
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/custom/icon-dir.tsx

@@ -0,0 +1,110 @@
+import { type SVGProps } from 'react'
+import { cn } from '@/lib/utils'
+import { type Direction } from '@/context/direction-provider'
+
+type IconDirProps = SVGProps<SVGSVGElement> & {
+  dir: Direction
+}
+
+export function IconDir({ dir, className, ...props }: IconDirProps) {
+  return (
+    <svg
+      data-name={`icon-dir-${dir}`}
+      xmlns='http://www.w3.org/2000/svg'
+      viewBox='0 0 79.86 51.14'
+      className={cn(dir === 'rtl' && 'rotate-y-180', className)}
+      {...props}
+    >
+      <path
+        d='M23.42.51h51.92c2.21 0 4 1.79 4 4v42.18c0 2.21-1.79 4-4 4H23.42s-.04-.02-.04-.04V.55s.02-.04.04-.04z'
+        opacity={0.15}
+      />
+      <path
+        fill='none'
+        opacity={0.72}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+        strokeWidth='2px'
+        d='M5.56 14.88L17.78 14.88'
+      />
+      <path
+        fill='none'
+        opacity={0.48}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+        strokeWidth='2px'
+        d='M5.56 22.09L16.08 22.09'
+      />
+      <path
+        fill='none'
+        opacity={0.55}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+        strokeWidth='2px'
+        d='M5.56 18.38L14.93 18.38'
+      />
+      <g strokeLinecap='round' strokeMiterlimit={10}>
+        <circle cx={7.51} cy={7.4} r={2.54} opacity={0.8} />
+        <path
+          fill='none'
+          opacity={0.8}
+          strokeWidth='2px'
+          d='M12.06 6.14L17.78 6.14'
+        />
+        <path fill='none' opacity={0.6} d='M11.85 8.79L16.91 8.79' />
+      </g>
+      <path
+        fill='none'
+        opacity={0.62}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+        strokeWidth='3px'
+        d='M29.41 7.4L34.67 7.4'
+      />
+      <rect
+        x={28.76}
+        y={11.21}
+        width={26.03}
+        height={2.73}
+        rx={0.64}
+        ry={0.64}
+        opacity={0.44}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+      <rect
+        x={28.76}
+        y={17.01}
+        width={44.25}
+        height={13.48}
+        rx={0.64}
+        ry={0.64}
+        opacity={0.3}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+      <rect
+        x={28.76}
+        y={33.57}
+        width={44.25}
+        height={4.67}
+        rx={0.64}
+        ry={0.64}
+        opacity={0.21}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+      <rect
+        x={28.76}
+        y={41.32}
+        width={36.21}
+        height={4.67}
+        rx={0.64}
+        ry={0.64}
+        opacity={0.3}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/custom/icon-layout-compact.tsx

@@ -0,0 +1,131 @@
+import { type SVGProps } from 'react'
+
+export function IconLayoutCompact(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      data-name='icon-layout-compact'
+      xmlns='http://www.w3.org/2000/svg'
+      viewBox='0 0 79.86 51.14'
+      {...props}
+    >
+      <rect
+        x={5.84}
+        y={5.2}
+        width={4}
+        height={40}
+        rx={2}
+        ry={2}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+      <g stroke='#fff' strokeLinecap='round' strokeMiterlimit={10}>
+        <path
+          fill='none'
+          opacity={0.66}
+          strokeWidth='2px'
+          d='M7.26 11.56L8.37 11.56'
+        />
+        <path
+          fill='none'
+          opacity={0.51}
+          strokeWidth='2px'
+          d='M7.26 14.49L8.37 14.49'
+        />
+        <path
+          fill='none'
+          opacity={0.52}
+          strokeWidth='2px'
+          d='M7.26 17.39L8.37 17.39'
+        />
+        <circle cx={7.81} cy={7.25} r={1.16} fill='#fff' opacity={0.8} />
+      </g>
+      <path
+        fill='none'
+        opacity={0.75}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+        strokeWidth='3px'
+        d='M15.81 14.49L22.89 14.49'
+      />
+      <rect
+        x={14.93}
+        y={18.39}
+        width={22.19}
+        height={2.73}
+        rx={0.64}
+        ry={0.64}
+        opacity={0.5}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+      <rect
+        x={14.93}
+        y={5.89}
+        width={59.16}
+        height={2.73}
+        rx={0.64}
+        ry={0.64}
+        opacity={0.9}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+      <rect
+        x={14.93}
+        y={24.22}
+        width={32.68}
+        height={19.95}
+        rx={2.11}
+        ry={2.11}
+        opacity={0.4}
+        strokeLinecap='round'
+        strokeMiterlimit={10}
+      />
+      <g strokeLinecap='round' strokeMiterlimit={10}>
+        <rect
+          x={59.05}
+          y={38.15}
+          width={2.01}
+          height={3.42}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.32}
+        />
+        <rect
+          x={54.78}
+          y={34.99}
+          width={2.01}
+          height={6.58}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.44}
+        />
+        <rect
+          x={63.17}
+          y={32.86}
+          width={2.01}
+          height={8.7}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.53}
+        />
+        <rect
+          x={67.54}
+          y={29.17}
+          width={2.01}
+          height={12.4}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.66}
+        />
+      </g>
+      <g opacity={0.5}>
+        <circle cx={62.16} cy={18.63} r={7.5} />
+        <path d='M62.16 11.63c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.14-7-7 3.14-7 7-7m0-1c-4.42 0-8 3.58-8 8s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8z' />
+      </g>
+      <g opacity={0.74}>
+        <path d='M63.04 18.13l3.38-5.67c.93.64 1.7 1.48 2.26 2.47.56.98.89 2.08.96 3.21h-6.6z' />
+        <path d='M66.57 13.19a6.977 6.977 0 012.52 4.44h-5.17l2.65-4.44m-.31-1.43l-4.1 6.87h8c0-1.39-.36-2.75-1.04-3.95a8.007 8.007 0 00-2.86-2.92z' />
+      </g>
+    </svg>
+  )
+}

package/.shadcn-admin-ref/src/assets/custom/icon-layout-default.tsx

@@ -0,0 +1,124 @@
+import { type SVGProps } from 'react'
+
+export function IconLayoutDefault(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      data-name='con-layout-default'
+      xmlns='http://www.w3.org/2000/svg'
+      viewBox='0 0 79.86 51.14'
+      {...props}
+    >
+      <path
+        d='M39.22 15.99h-8.16c-.79 0-1.43-.67-1.43-1.5s.64-1.5 1.43-1.5h8.16c.79 0 1.43.67 1.43 1.5s-.64 1.5-1.43 1.5z'
+        opacity={0.75}
+      />
+      <rect
+        x={29.63}
+        y={18.39}
+        width={16.72}
+        height={2.73}
+        rx={1.36}
+        ry={1.36}
+        opacity={0.5}
+      />
+      <path
+        d='M75.1 6.68v1.45c0 .63-.49 1.14-1.09 1.14H30.72c-.6 0-1.09-.51-1.09-1.14V6.68c0-.62.49-1.14 1.09-1.14h43.29c.6 0 1.09.52 1.09 1.14z'
+        opacity={0.9}
+      />
+      <rect
+        x={29.63}
+        y={24.22}
+        width={21.8}
+        height={19.95}
+        rx={2.11}
+        ry={2.11}
+        opacity={0.4}
+      />
+      <g strokeLinecap='round' strokeMiterlimit={10}>
+        <rect
+          x={61.06}
+          y={38.15}
+          width={2.01}
+          height={3.42}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.32}
+        />
+        <rect
+          x={56.78}
+          y={34.99}
+          width={2.01}
+          height={6.58}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.44}
+        />
+        <rect
+          x={65.17}
+          y={32.86}
+          width={2.01}
+          height={8.7}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.53}
+        />
+        <rect
+          x={69.55}
+          y={29.17}
+          width={2.01}
+          height={12.4}
+          rx={0.33}
+          ry={0.33}
+          opacity={0.66}
+        />
+      </g>
+      <g opacity={0.5}>
+        <circle cx={63.17} cy={18.63} r={7.5} />
+        <path d='M63.17 11.63c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.14-7-7 3.14-7 7-7m0-1c-4.42 0-8 3.58-8 8s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8z' />
+      </g>
+      <g opacity={0.74}>
+        <path d='M64.05 18.13l3.38-5.67c.93.64 1.7 1.48 2.26 2.47.56.98.89 2.08.96 3.21h-6.6z' />
+        <path d='M67.57 13.19a6.977 6.977 0 012.52 4.44h-5.17l2.65-4.44m-.31-1.43l-4.1 6.87h8c0-1.39-.36-2.75-1.04-3.95a8.007 8.007 0 00-2.86-2.92z' />
+      </g>
+      <g strokeLinecap='round' strokeMiterlimit={10}>
+        <rect
+          x={5.84}
+          y={5.02}
+          width={19.14}
+          height={40}
+          rx={2}
+          ry={2}
+          opacity={0.8}
+        />
+        <g stroke='#fff'>
+          <path
+            fill='none'
+            opacity={0.72}
+            strokeWidth='2px'
+            d='M9.02 17.39L21.25 17.39'
+          />
+          <path
+            fill='none'
+            opacity={0.48}
+            strokeWidth='2px'
+            d='M9.02 24.6L19.54 24.6'
+          />
+          <path
+            fill='none'
+            opacity={0.55}
+            strokeWidth='2px'
+            d='M9.02 20.88L18.4 20.88'
+          />
+          <circle cx={10.98} cy={9.91} r={2.54} fill='#fff' opacity={0.8} />
+          <path
+            fill='none'
+            opacity={0.8}
+            strokeWidth='2px'
+            d='M15.53 8.65L21.25 8.65'
+          />
+          <path fill='none' opacity={0.6} d='M15.32 11.3L20.38 11.3' />
+        </g>
+      </g>
+    </svg>
+  )
+}