feat(shared/ui/cuhacking/components): create terminal text

libs/shared/ui/src/cuHacking/components/terminal-text/index.ts

@@ -0,0 +1 @@
+export { TerminalText } from './terminal-text'

libs/shared/ui/src/cuHacking/components/terminal-text/terminal-text.tsx

@@ -0,0 +1,46 @@
+import type Media from '@cuhacking/types/media'
+import type { ReactNode } from 'react'
+import { cn } from '@shadcn/lib/utils'
+import { cva } from 'class-variance-authority'
+import React from 'react'
+import { Icon } from '../icon/icon'
+
+interface TerminalTextProps {
+  children: ReactNode
+  icon?: Media
+  className?: string
+  callToAction?: boolean
+}
+
+const callToActionVariation = cva(
+  '',
+  {
+    variants: {
+      callToAction: {
+        true: 'bg-greendiant bg-clip-text text-transparent',
+        false: '',
+      },
+    },
+  },
+)
+
+const terminalTextVariation = cva(
+  'flex flex-row gap-x-3 font-sans items-center',
+)
+
+export function TerminalText({ icon, children, className = '', callToAction }: TerminalTextProps) {
+  return (
+    <div className={cn(terminalTextVariation({ className }))}>
+      { !icon
+        ? (
+            <div className="text-muted">
+              ~
+            </div>
+          )
+        : <Icon media={icon} />}
+      <div className={cn(callToActionVariation({ callToAction }))}>
+        {children}
+      </div>
+    </div>
+  )
+}