task_id: task_create_component_social_share_buttons
entity_id: component_social_share_buttons
generated_at: '2025-12-18T18:15:12.918473'
workflow_version: v004
target:
  type: component
  definition:
    id: component_social_share_buttons
    name: SocialShareButtons
    description: Social media share buttons for Twitter and Facebook
    file_path: components/SocialShareButtons.tsx
    props:
    - name: url
      type: string
      required: true
      description: URL to share
    - name: title
      type: string
      required: true
      description: Title/text to include in share
    - name: type
      type: '''song'' | ''playlist'' | ''album'''
      required: false
      description: Type of content for customized share text
    events:
    - name: onPlatformShare
      payload: '{ platform: string }'
      description: Fired when user clicks a social share button
    uses_components: []
    uses_apis: []
    business_logic:
    - Twitter button opens Twitter intent URL with pre-filled text
    - Facebook button opens Facebook sharer dialog
    - Generate share text based on content type
    - URL encode parameters properly
    styling:
    - Buttons with platform brand colors
    - Platform icons (Twitter bird, Facebook f)
    - Hover and focus states
    - Responsive layout (stack on mobile)
related:
  models: []
  apis: []
  components: []
dependencies:
  entity_ids: []
  definitions: []
files:
  to_create:
  - app/components/SocialShareButtons.tsx
  reference: []
acceptance:
- criterion: Component renders without errors
  verification: Import and render in test
- criterion: Props are typed correctly
  verification: TypeScript compilation
- criterion: Events fire correctly
  verification: Test event handlers