@flamingo-stack/openframe-frontend-core 0.0.518-1660.4292.1 → 0.0.518

package/src/components/empty-vendor-icon.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+
+interface EmptyVendorIconProps {
+  className?: string;
+}
+
+export function EmptyVendorIcon({ className }: EmptyVendorIconProps) {
+  return (
+    <svg 
+      width="24" 
+      height="24" 
+      viewBox="0 0 24 24" 
+      fill="none" 
+      xmlns="http://www.w3.org/2000/svg" 
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+      className={className}
+    >
+      <path 
+        d="M0 4C0 1.79086 1.79086 0 4 0H20C22.2091 0 24 1.79086 24 4V20C24 22.2091 22.2091 24 20 24H4C1.79086 24 0 22.2091 0 20V4Z" 
+        fill="url(#pattern0_1643_33816)"
+      />
+      <defs>
+        <pattern 
+          id="pattern0_1643_33816" 
+          patternContentUnits="objectBoundingBox" 
+          width="1" 
+          height="1"
+        >
+          <use 
+            xlinkHref="#image0_1643_33816" 
+            transform="scale(0.0104167)"
+          />
+        </pattern>
+        <image 
+          id="image0_1643_33816" 
+          width="96" 
+          height="96" 
+          preserveAspectRatio="none" 
+          xlinkHref="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANKSURBVHgB7Z2JbiIxEETNfSPB/38j4hI37G5FQjuJGBjwUe5JPWkUKaCI+Hna7XZP0vjzDydoNJ2gIgFkJICMBJCRADISQEYCyEgAGQkgIwFkJICMBJCRADISQEYCyLSdJ+fz2S0WC2f5WKHRaLjRaOTG47FLjfcdsFwuTQ8+wOffbreU38NbwPV6dXUBd3NqtAaQkQAyEkDGOwsqYzAYULKKVxwOB7fZbFwuRBPQarW+rtxoNvO66RWCyEgAGQkgIwFkoi3Cr8AOmrGLvlwuH732k1BJBkXAer12u93O5QY+1ztMp1M3HA6dD8lDEOotOQ7+J6CA50tyAXXqhr/dbs4XLcJkJICMBJChpaGPmEwmrtPpuNxAAS9W4pCVAAx+t9t1uRFzv6IQREYCyEgAGQkgk9UiXAUUzFDOwMlWu93O8tTtHcwIQAkDTWDH4/Hb93HunOPZc1XMhCBUKn8OPkBBzHJxz4QA5OH7/b709RBVSRYmBJxOp6evoypptUWyNllQbu0mVTHxqXu93lcLeRkoYTx7PWeiZUGI2Y9CxycHMpjdyHTKOtpwNGiVaAJCH7rjAQqIwIJ7/7ko3EFMjhXUqpjaiKHfFBcEQIbVsFPE3E4YWN/9FvFehOswC5l4C0BIEJ/jHYKQgWAxrJrd1KkvKARB1oB+v1/5vYjfEvAfnQeQkQAyEkBGAshIABkJIJNVKQKFtnfKDKgHoZ3RMlkJeHXy9YgUAkI8B1CGyWJcCrCzx4YRO/dHzQChkIACuAOLVwqSC8ipeopZjtZzDDa+Mh6fSi4AiywksJ4VQ2cdQgquVLP8GckFIHOZzWZv9fL4HG9C9D2OI6aHFB+iI4+yBqB8PZ/PK78fB/yr1ary+yELIQWDjsEPOejoR0WXBq4QD5PUZhFGOMGAY+BDNgMgXOLQHwOOh7JDr2HmBeBPZoae5VincMaBQY/dc2ReQKiFFOEEA46BT3no/2v3AZjVCCn38MJKj3+VAMzy4pUDtRaAWY2QgsHG1xxbaGonIHSaGBvzAmKnibEx25qYKk2MjQkBGGBWmhibhv6fMBedCZORADISQEYCyEgAGQkgIwFkJICMBJCRADISQEYCyEgAGQkgIwFk/gLUSDIjX8qP4wAAAABJRU5ErkJggg=="
+        />
+      </defs>
+    </svg>
+  );
+} 

package/src/components/features/auth-providers-list.tsx

@@ -62,7 +62,7 @@ export function AuthProvidersList({
           .map((provider) => (
             <ProviderButton
               key={provider.provider}
-              provider={provider.provider as 'microsoft' | 'google' | 'slack' | 'github'}
+              provider={provider.provider as 'microsoft' | 'google' | 'slack' | 'github' | 'apple'}
               onClick={() => handleProviderClick(provider.provider)}
               disabled={loading}
               loading={loading}

package/src/components/features/platform-badge.tsx

@@ -2,8 +2,8 @@
 
 import React from 'react';
 import { cn } from '../../utils/cn';
-import { FlamingoLogo } from '../icons/flamingo-logo';
-import { OpenmspLogo } from '../icons/openmsp-logo';
+import { FlamingoLogo } from '../flamingo-logo';
+import { OpenmspLogo } from '../openmsp-logo';
 import { OpenFrameLogo } from '../icons/openframe-logo';
 import { MiamiCyberGangLogoFaceOnly } from '../icons/miami-cyber-gang-logo-face-only';
 import { Globe } from 'lucide-react';

package/src/components/features/provider-button.tsx

@@ -2,10 +2,10 @@
 
 import { useState } from 'react';
 import { Button } from "../ui/button";
-import { MicrosoftIcon, GoogleLogo, SlackIcon, GitHubIcon } from "../icons";
+import { MicrosoftIcon, GoogleLogo, SlackIcon, GitHubIcon, AppleIcon } from "../icons";
 
 interface ProviderButtonProps {
-  provider: 'microsoft' | 'google' | 'slack' | 'github';
+  provider: 'microsoft' | 'google' | 'slack' | 'github' | 'apple';
   onClick: () => Promise<void> | void;
   disabled?: boolean;
   loading?: boolean;
@@ -28,6 +28,10 @@ const PROVIDER_CONFIG = {
     displayName: 'Continue with GitHub',
     icon: GitHubIcon,
   },
+  apple: {
+    displayName: 'Continue with Apple',
+    icon: AppleIcon,
+  },
 };
 
 export function ProviderButton({ provider, onClick, disabled = false, loading = false }: ProviderButtonProps) {

package/src/components/flamingo-logo.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+interface FlamingoLogoProps extends React.SVGProps<SVGSVGElement> {
+  className?: string;
+  size?: number;
+  color?: string;
+}
+
+export function FlamingoLogo({ className = '', color="var(--ods-flamingo-pink-base)" ,size=120, ...props }: FlamingoLogoProps) {
+  return (
+    <svg
+      width={size}
+      height={size} 
+      viewBox="0 0 121 120" 
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      {...props}
+    >
+      <path 
+        fillRule="evenodd" 
+        clipRule="evenodd" 
+        d="M20.8645 77.9756C20.6306 78.095 20.3452 77.9582 20.3369 77.7002C20.2055 73.6173 23.4398 62.2314 27.7657 59.0452C31.477 45.9806 61.8811 24.0208 81.7715 48.2044C83.1662 49.7884 84.0264 52.0978 84.7512 54.0436C86.0615 57.5613 86.9291 59.8908 89.7117 54.5977C92.4782 49.335 87.2725 42.2381 81.701 34.6426C75.7955 26.5918 69.4791 17.9808 71.8102 10.4001C75.4609 -1.47146 91.9849 -4.33245 94.5422 7.89834C98.4226 10.7002 104.422 17.0815 96.2751 25.8554C96.0466 26.1014 95.6263 25.9453 95.6104 25.6132C95.417 21.5769 93.9498 16.1177 90.5641 14.5697C89.0187 13.8632 88.0307 13.6723 87.1405 13.5003C85.585 13.1998 84.3282 12.9569 80.919 10.1221C75.236 5.39658 75.236 20.1291 87.7386 32.3599C97.1156 41.533 106.493 66.2324 84.0287 70.9981C74.9174 72.9311 68.0892 72.0015 61.3076 71.0782C61.0953 71.0493 60.8831 71.0204 60.6708 70.9916V89.3274L66.3745 91.8104C67.0914 92.1225 67.4139 92.944 67.0949 93.6453C66.7759 94.3466 65.9362 94.6621 65.2193 94.35L60.6708 92.37V118.61C60.6708 119.378 60.0347 120 59.2501 120C58.4654 120 57.8293 119.378 57.8293 118.61V91.133L42.4873 84.4542C42.0611 84.2686 41.7551 83.8902 41.6687 83.4417C41.5824 82.9931 41.7266 82.5317 42.0546 82.2072L54.1527 70.2377C45.537 69.536 35.8193 70.3474 20.8645 77.9756ZM57.7692 70.613L45.5202 82.732L57.8293 88.0905V70.6204C57.8093 70.618 57.7893 70.6155 57.7692 70.613Z" 
+        fill={color}
+      />
+    </svg>
+  );
+} 

package/src/components/form.tsx

@@ -0,0 +1,138 @@
+"use client"
+
+import * as React from "react"
+import type * as LabelPrimitive from "@radix-ui/react-label"
+import { Slot } from "@radix-ui/react-slot"
+import {
+  Controller,
+  type ControllerProps,
+  type FieldPath,
+  type FieldValues,
+  FormProvider,
+  useFormContext,
+} from "react-hook-form"
+
+import { cn } from "../utils/cn"
+import { Label } from "./ui/label"
+
+const Form = FormProvider
+
+type FormFieldContextValue<
+  TFieldValues extends FieldValues = FieldValues,
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+> = {
+  name: TName
+}
+
+const FormFieldContext = React.createContext<FormFieldContextValue>({} as FormFieldContextValue)
+
+const FormField = <
+  TFieldValues extends FieldValues = FieldValues,
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+>({
+  ...props
+}: ControllerProps<TFieldValues, TName>) => {
+  return (
+    <FormFieldContext.Provider value={{ name: props.name }}>
+      <Controller {...props} />
+    </FormFieldContext.Provider>
+  )
+}
+
+const useFormField = () => {
+  const fieldContext = React.useContext(FormFieldContext)
+  const itemContext = React.useContext(FormItemContext)
+  const { getFieldState, formState } = useFormContext()
+
+  const fieldState = getFieldState(fieldContext.name, formState)
+
+  if (!fieldContext) {
+    throw new Error("useFormField should be used within <FormField>")
+  }
+
+  const { id } = itemContext
+
+  return {
+    id,
+    name: fieldContext.name,
+    formItemId: `${id}-form-item`,
+    formDescriptionId: `${id}-form-item-description`,
+    formMessageId: `${id}-form-item-message`,
+    ...fieldState,
+  }
+}
+
+type FormItemContextValue = {
+  id: string
+}
+
+const FormItemContext = React.createContext<FormItemContextValue>({} as FormItemContextValue)
+
+const FormItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => {
+    const id = React.useId()
+
+    return (
+      <FormItemContext.Provider value={{ id }}>
+        <div ref={ref} className={cn("space-y-2", className)} {...props} />
+      </FormItemContext.Provider>
+    )
+  },
+)
+FormItem.displayName = "FormItem"
+
+const FormLabel = React.forwardRef<
+  React.ElementRef<typeof LabelPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>
+>(({ className, ...props }, ref) => {
+  const { error, formItemId } = useFormField()
+
+  return <Label ref={ref} className={cn(error && "text-destructive", className)} htmlFor={formItemId} {...props} />
+})
+FormLabel.displayName = "FormLabel"
+
+const FormControl = React.forwardRef<React.ElementRef<typeof Slot>, React.ComponentPropsWithoutRef<typeof Slot>>(
+  ({ ...props }, ref) => {
+    const { error, formItemId, formDescriptionId, formMessageId } = useFormField()
+
+    return (
+      <Slot
+        ref={ref}
+        id={formItemId}
+        aria-describedby={!error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`}
+        aria-invalid={!!error}
+        {...props}
+      />
+    )
+  },
+)
+FormControl.displayName = "FormControl"
+
+const FormDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
+  ({ className, ...props }, ref) => {
+    const { formDescriptionId } = useFormField()
+
+    return <p ref={ref} id={formDescriptionId} className={cn("text-h6 text-muted-foreground", className)} {...props} />
+  },
+)
+FormDescription.displayName = "FormDescription"
+
+const FormMessage = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
+  ({ className, children, ...props }, ref) => {
+    const { error, formMessageId } = useFormField()
+    const body = error ? String(error?.message) : children
+
+    if (!body) {
+      return null
+    }
+
+    return (
+      <p ref={ref} id={formMessageId} className={cn("text-h6 text-destructive", className)} {...props}>
+        {body}
+      </p>
+    )
+  },
+)
+FormMessage.displayName = "FormMessage"
+
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField }

package/src/components/github-icon.tsx

@@ -0,0 +1,26 @@
+import React from 'react';
+
+interface GitHubIconProps {
+  className?: string;
+  width?: number;
+  height?: number;
+}
+
+export const GitHubIcon: React.FC<GitHubIconProps> = ({ 
+  className = "", 
+  width = 15, 
+  height = 14 
+}) => {
+  return (
+    <svg 
+      width={width} 
+      height={height} 
+      viewBox="0 0 15 14" 
+      fill="none" 
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path d="M7.18173 0.333008C3.40523 0.333008 0.346436 3.3918 0.346436 7.1683C0.346436 10.1929 2.30304 12.7476 5.02007 13.6533C5.36183 13.7131 5.48999 13.508 5.48999 13.3286C5.48999 13.1663 5.48145 12.628 5.48145 12.0555C3.76408 12.3717 3.31979 11.6369 3.18308 11.2524C3.10618 11.0559 2.77296 10.4492 2.48246 10.2869C2.24323 10.1587 1.90146 9.84261 2.47392 9.83406C3.0122 9.82552 3.39668 10.3296 3.52485 10.5347C4.14002 11.5685 5.1226 11.278 5.51563 11.0986C5.57543 10.6543 5.75486 10.3553 5.95137 10.1844C4.43052 10.0135 2.84132 9.42395 2.84132 6.80945C2.84132 6.06611 3.10618 5.45093 3.54193 4.97246C3.47358 4.80158 3.23435 4.10096 3.61029 3.16111C3.61029 3.16111 4.18274 2.98168 5.48999 3.86173C6.03682 3.70793 6.61782 3.63104 7.19882 3.63104C7.77982 3.63104 8.36082 3.70793 8.90764 3.86173C10.2149 2.97314 10.7873 3.16111 10.7873 3.16111C11.1633 4.10096 10.9241 4.80158 10.8557 4.97246C11.2914 5.45093 11.5563 6.05757 11.5563 6.80945C11.5563 9.43249 9.95856 10.0135 8.43771 10.1844C8.68549 10.398 8.8991 10.8081 8.8991 11.4489C8.8991 12.3631 8.89055 13.0979 8.89055 13.3286C8.89055 13.508 9.01871 13.7216 9.36048 13.6533C10.7174 13.1952 11.8965 12.3231 12.7318 11.1597C13.5671 9.99643 14.0166 8.60046 14.017 7.1683C14.017 3.3918 10.9582 0.333008 7.18173 0.333008Z" fill="currentColor"/>
+    </svg>
+  );
+}; 

package/src/components/google-logo.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+
+export const GoogleLogo = ({ className, ...props }: { className?: string } & React.SVGProps<SVGSVGElement>) => (
+  <svg
+    {...props}
+    className={className}
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g>
+      <path
+        d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
+        fill="#4285F4"
+      />
+      <path
+        d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
+        fill="#34A853"
+      />
+      <path
+        d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
+        fill="#FBBC05"
+      />
+      <path
+        d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
+        fill="#EB4335"
+      />
+    </g>
+  </svg>
+); 

package/src/components/hamburger-icon.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+interface HamburgerIconProps {
+  width?: number;
+  height?: number;
+  className?: string;
+}
+
+export function HamburgerIcon({ width = 16, height = 16, className = '' }: HamburgerIconProps) {
+  return (
+    <svg 
+      width={width} 
+      height={height} 
+      viewBox="0 0 16 16" 
+      fill="none" 
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path 
+        d="M14 11.25C14.4142 11.25 14.75 11.5858 14.75 12C14.75 12.4142 14.4142 12.75 14 12.75H2C1.58579 12.75 1.25 12.4142 1.25 12C1.25 11.5858 1.58579 11.25 2 11.25H14Z" 
+        fill="#FAFAFA"
+      />
+      <path 
+        d="M14 7.25C14.4142 7.25 14.75 7.58579 14.75 8C14.75 8.41421 14.4142 8.75 14 8.75H2C1.58579 8.75 1.25 8.41421 1.25 8C1.25 7.58579 1.58579 7.25 2 7.25H14ZM14 3.25C14.4142 3.25 14.75 3.58579 14.75 4C14.75 4.41421 14.4142 4.75 14 4.75H2C1.58579 4.75 1.25 4.41421 1.25 4C1.25 3.58579 1.58579 3.25 2 3.25H14Z" 
+        fill="#FAFAFA"
+      />
+    </svg>
+  );
+} 

package/src/components/hubspot-icon.tsx

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { cn } from "../utils/cn";
+
+/**
+ * HubSpot brand logo (solid orange)
+ * Usage: <HubspotIcon className="h-4 w-4" />
+ */
+export function HubspotIcon({ className, fill = '#FF7A59', ...props }: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 512 512"
+      fill={fill}
+      className={cn('inline-block', className)}
+      {...props}
+    >
+      <path d="M266.197 216.109c-22.551 21.293-36.655 51.48-36.655 84.991 0 26.326 8.714 50.582 23.359 70.08l-44.473 44.74c-3.953-1.438-8.176-2.245-12.579-2.245-9.702 0-18.776 3.774-25.605 10.602-6.828 6.827-10.602 15.989-10.602 25.696 0 9.701 3.773 18.775 10.602 25.605 6.829 6.826 15.993 10.42 25.605 10.42 9.703 0 18.777-3.505 25.695-10.42 6.829-6.83 10.602-15.994 10.602-25.605 0-3.774-.538-7.369-1.707-10.873l44.923-45.102c19.765 15.183 44.381 24.169 71.244 24.169 64.599 0 116.797-52.38 116.797-116.977 0-58.578-42.854-107.093-99.007-115.628v-55.343c15.723-6.65 25.335-21.384 25.335-38.545 0-23.449-18.777-43.034-42.227-43.034-23.448 0-41.956 19.585-41.956 43.034 0 17.161 9.613 31.895 25.335 38.545v54.983c-13.655 1.887-26.593 6.019-38.362 12.219-24.796-18.778-105.565-76.997-151.746-112.126 1.078-3.953 1.798-8.085 1.798-12.397 0-25.875-21.113-46.898-47.078-46.898-25.875 0-46.898 21.023-46.898 46.898 0 25.965 21.023 46.988 46.898 46.988 8.805 0 16.98-2.606 24.078-6.828L266.197 216.109zM346.606 363.095c-34.229 0-61.991-27.763-61.991-61.994 0-34.229 27.762-61.99 61.991-61.99 34.23 0 61.992 27.761 61.992 61.99 0 34.231-27.762 61.994-61.992 61.994z" />
+    </svg>
+  );
+} 

package/src/components/icon-utils.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+import {
+  Megaphone,
+  Bell,
+  Info,
+  Star,
+  Rocket,
+  Package,
+} from 'lucide-react';
+import { OpenFrameLogo } from './openframe-logo';
+import { OpenmspLogo } from './openmsp-logo';
+import { FlamingoLogo } from './flamingo-logo';
+
+/**
+ * Returns a JSX element for a known icon name, spreading any extra props.
+ * Falls back to Megaphone if the name is not recognised.
+ */
+export function renderSvgIcon(
+  name: string,
+  props: React.SVGProps<SVGSVGElement | SVGElement> = {}
+): React.ReactElement {
+  const map: Record<string, (p: any) => React.ReactElement> = {
+    megaphone:   (p) => <Megaphone {...p} />,
+    bell:        (p) => <Bell {...p} />,
+    info:        (p) => <Info {...p} />,
+    star:        (p) => <Star {...p} />,
+    rocket:      (p) => <Rocket {...p} />,
+    package:     (p) => <Package {...p} />,
+    'openframe-logo': (p) => <OpenFrameLogo {...p} />,
+    'openmsp-logo':   (p) => <OpenmspLogo {...p} />,
+    'flamingo': (p)=> <FlamingoLogo {...p} />,
+  };
+
+  const renderer = map[name] || map['megaphone'];
+  return renderer(props);
+} 

package/src/components/icons/apple-icon.tsx

@@ -0,0 +1,30 @@
+import React from 'react'
+
+interface AppleIconProps {
+  width?: number | string
+  height?: number | string
+  className?: string
+}
+
+/** @deprecated Use icons from icons-v2-generated instead. */
+export function AppleIcon({
+  width = 24,
+  height = 24,
+  className = "text-current"
+  }: AppleIconProps) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M12.152 6.896c-.948 0-2.415-1.078-3.96-1.04-2.04.027-3.91 1.183-4.961 3.014-2.117 3.675-.546 9.103 1.519 12.09 1.013 1.454 2.208 3.09 3.792 3.039 1.52-.065 2.09-.987 3.935-.987 1.831 0 2.35.987 3.96.948 1.637-.026 2.676-1.48 3.676-2.948 1.156-1.688 1.636-3.325 1.662-3.415-.039-.013-3.182-1.221-3.22-4.857-.026-3.04 2.48-4.494 2.597-4.559-1.429-2.09-3.623-2.324-4.39-2.376-2-.156-3.675 1.09-4.61 1.09zM15.53 3.83c.843-1.012 1.4-2.427 1.245-3.83-1.207.052-2.662.805-3.532 1.818-.78.896-1.454 2.338-1.273 3.714 1.338.104 2.715-.688 3.56-1.702"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/icons/index.ts

@@ -81,6 +81,7 @@ export { GitHubIcon } from './github-icon';
 export { SlackIcon } from './slack-icon';
 export { ClickUpIcon } from './clickup-icon';
 export { MicrosoftIcon } from './ms-icon';
+export { AppleIcon } from './apple-icon';
 export { GoogleLogo } from './google-logo';
 export { RedditIcon } from './reddit-icon';
 export { XLogo } from './x-logo';