Update props in components

app/components/modals/Alert/Alert.container.tsx

@@ -11,6 +11,8 @@ const AlertContainer = memo<AlertProps>(
     description,
     status: statusProp = "default",
     type: typeProp = "toast",
+    hasLeadingIcon = true,
+    hasBodyText = true,
     onClose,
     className = "",
   }) => {
@@ -104,6 +106,8 @@ const AlertContainer = memo<AlertProps>(
         description={description}
         status={status}
         type={type}
+        hasLeadingIcon={hasLeadingIcon}
+        hasBodyText={hasBodyText}
         className={className}
         containerClasses={containerClasses}
         containerStyle={containerStyle}

app/components/modals/Alert/Alert.types.ts

@@ -23,6 +23,16 @@ export interface AlertProps {
    * Figma uses PascalCase, codebase uses lowercase - both are supported.
    */
   type?: AlertTypeValue;
+  /**
+   * Whether to show the leading icon (Figma prop).
+   * @default true
+   */
+  hasLeadingIcon?: boolean;
+  /**
+   * Whether to show body text/description (Figma prop).
+   * @default true
+   */
+  hasBodyText?: boolean;
   onClose?: () => void;
   className?: string;
 }
@@ -32,6 +42,8 @@ export interface AlertViewProps {
   description?: string;
   status: "default" | "positive" | "warning" | "danger";
   type: "toast" | "banner";
+  hasLeadingIcon: boolean;
+  hasBodyText: boolean;
   className: string;
   containerClasses: string;
   containerStyle?: React.CSSProperties;

app/components/modals/Alert/Alert.view.tsx

@@ -6,6 +6,8 @@ export function AlertView({
   description,
   status: _status,
   type: _type,
+  hasLeadingIcon,
+  hasBodyText,
   className,
   containerClasses,
   containerStyle,
@@ -41,12 +43,16 @@ export function AlertView({
       style={containerStyle}
       role="alert"
     >
-      <div className="shrink-0 w-[24px] h-[24px] flex items-center justify-center">
-        {getIcon()}
-      </div>
+      {hasLeadingIcon && (
+        <div className="shrink-0 w-[24px] h-[24px] flex items-center justify-center">
+          {getIcon()}
+        </div>
+      )}
       <div className="flex flex-1 flex-col items-start justify-center min-h-0 min-w-0">
         <p className={titleClasses}>{title}</p>
-        {description && <p className={descriptionClasses}>{description}</p>}
+        {hasBodyText && description && (
+          <p className={descriptionClasses}>{description}</p>
+        )}
       </div>
       <Button
         variant="ghost"