Social Share Item Component

This component is designed to create a share button or a link for various social media platforms. The component is highly customizable and can handle different types of social media platforms including Facebook, Instagram, YouTube, Pinterest, Email, and more.

Props

| Name | Type | Description | |:------------------------|:----------------------|:-------------------------------------------------------------------------------------------------------------------------------------------------------------------| | data-social | string | Required. the name of the social ['facebook','twitter','linkedin','youtube','instagram','whatsapp','pinterest','tiktok','email','print','copy'] | | data-is-share | boolean or string | (bool) set if the button is a share button or a link (the share is only for facebook, linkedin, pinterest, and twitter) use false for copy type. Defaults to false | | data-href | string | url for external page. Defaults to an empty string. | | data-subject-mail | string | The subject of the email (only for mail). Defaults to an empty string. | | data-content-mail | string | The content of the email (only for mail). Defaults to an empty string. | | data-content-whatsapp | string | The content of the WhatsApp text (only for WhatsApp). Defaults to an empty string. | | data-share-url | string | The URL of the share. Defaults to an empty string. |

Usage/Examples

<template>
  <social-share-item-cmp
    data-social="facebook"
    data-is-share="true"
    data-share-url="https://yourwebsite.com"
  >
    <template #default="slotProps">
      <a :href="slotProps.hrefUrl" target="_blank" @click="slotProps.handleClick">
        <svg><!-- Your SVG icon here --></svg>
      </a>
    </template>
  </social-share-item-cmp>
</template>