feat: add Sheet component for bottom sheet UI with drag-to-dismiss and snap points

test: implement DialogStyleContext tests for preference management and style recommendations

test: create tests for useAutoSelection hook, including countdown and pause functionality

feat: implement useAutoSelection hook for enhanced auto-selection with sound notifications

feat: create Zustand store for managing issue submission wizard state

feat: add Zod validation schemas for issue-related API requests

feat: implement issue service for CRUD operations and validation handling

feat: define TypeScript types for issue submission and management

ccw/frontend/src/components/layout/A2UIButton.tsx

@@ -0,0 +1,53 @@
+// ========================================
+// A2UI Button Component
+// ========================================
+// Quick action button for A2UI dialog in toolbar
+
+import { useIntl } from 'react-intl';
+import { MessageSquare } from 'lucide-react';
+import { Button } from '@/components/ui/Button';
+import { useDialogStyleContext } from '@/contexts/DialogStyleContext';
+import { cn } from '@/lib/utils';
+
+interface A2UIButtonProps {
+  className?: string;
+  compact?: boolean;
+}
+
+export function A2UIButton({ className, compact = false }: A2UIButtonProps) {
+  const { formatMessage } = useIntl();
+  const { preferences } = useDialogStyleContext();
+
+  // Don't render if hidden in preferences
+  if (!preferences.showA2UIButtonInToolbar) {
+    return null;
+  }
+
+  const handleClick = () => {
+    // Trigger A2UI quick action - this would typically open a dialog
+    // For now, we'll just log the action
+    console.log('[A2UIButton] Quick action triggered');
+  };
+
+  return (
+    <Button
+      variant="default"
+      size={compact ? 'icon' : 'sm'}
+      onClick={handleClick}
+      className={cn(
+        'gap-2 bg-primary text-primary-foreground hover:bg-primary/90',
+        className
+      )}
+      title={formatMessage({ id: 'toolbar.a2ui.quickAction', defaultMessage: 'A2UI Quick Action' })}
+    >
+      <MessageSquare className="h-4 w-4" />
+      {!compact && (
+        <span className="hidden sm:inline">
+          {formatMessage({ id: 'toolbar.a2ui.button', defaultMessage: 'A2UI' })}
+        </span>
+      )}
+    </Button>
+  );
+}
+
+export default A2UIButton;