@postal-music/icons 0.1.0

package/src/icons/security/PasswordInputIcon.web.tsx

@@ -0,0 +1,30 @@
+import * as React from "react";
+
+interface PasswordInputIconProps extends React.SVGProps<SVGSVGElement> {
+    size?: number;
+}
+
+export const PasswordInputIcon = ({
+  className,
+  size = 18,
+  ...props
+}: PasswordInputIconProps) => (
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 18 18"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    className={className}
+    aria-hidden="true"
+    {...props}
+  >
+    <path
+      d="M16.5 8.25V6.15C16.5 5.30992 16.5 4.88988 16.3365 4.56901C16.1927 4.28677 15.9632 4.0573 15.681 3.91349C15.3601 3.75 14.9401 3.75 14.1 3.75H3.9C3.05992 3.75 2.63988 3.75 2.31901 3.91349C2.03677 4.0573 1.8073 4.28677 1.66349 4.56901C1.5 4.88988 1.5 5.30992 1.5 6.15V8.85C1.5 9.69008 1.5 10.1101 1.66349 10.431C1.8073 10.7132 2.03677 10.9427 2.31901 11.0865C2.63988 11.25 3.05992 11.25 3.9 11.25H8.25M9 7.5H9.00375M12.75 7.5H12.7538M5.25 7.5H5.25375M14.4375 12.75V11.4375C14.4375 10.7126 13.8499 10.125 13.125 10.125C12.4001 10.125 11.8125 10.7126 11.8125 11.4375V12.75M9.1875 7.5C9.1875 7.60355 9.10355 7.6875 9 7.6875C8.89645 7.6875 8.8125 7.60355 8.8125 7.5C8.8125 7.39645 8.89645 7.3125 9 7.3125C9.10355 7.3125 9.1875 7.39645 9.1875 7.5ZM12.9375 7.5C12.9375 7.60355 12.8536 7.6875 12.75 7.6875C12.6464 7.6875 12.5625 7.60355 12.5625 7.5C12.5625 7.39645 12.6464 7.3125 12.75 7.3125C12.8536 7.3125 12.9375 7.39645 12.9375 7.5ZM5.4375 7.5C5.4375 7.60355 5.35355 7.6875 5.25 7.6875C5.14645 7.6875 5.0625 7.60355 5.0625 7.5C5.0625 7.39645 5.14645 7.3125 5.25 7.3125C5.35355 7.3125 5.4375 7.39645 5.4375 7.5ZM11.7 15.75H14.55C14.97 15.75 15.1801 15.75 15.3405 15.6683C15.4816 15.5963 15.5963 15.4816 15.6683 15.3405C15.75 15.1801 15.75 14.97 15.75 14.55V13.95C15.75 13.53 15.75 13.3199 15.6683 13.1595C15.5963 13.0184 15.4816 12.9037 15.3405 12.8317C15.1801 12.75 14.97 12.75 14.55 12.75H11.7C11.28 12.75 11.0699 12.75 10.9095 12.8317C10.7684 12.9037 10.6537 13.0184 10.5817 13.1595C10.5 13.3199 10.5 13.53 10.5 13.95V14.55C10.5 14.97 10.5 15.1801 10.5817 15.3405C10.6537 15.4816 10.7684 15.5963 10.9095 15.6683C11.0699 15.75 11.28 15.75 11.7 15.75Z"
+      stroke="currentColor"
+      strokeWidth="1.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </svg>
+);

package/src/icons/security/index.ts

@@ -0,0 +1,5 @@
+export { default as EyeIcon } from './EyeIcon';
+export { default as Lock03Icon } from './Lock03Icon';
+export { default as LockIcon } from './LockIcon';
+export { default as LockUnlocked03Icon } from './LockUnlocked03Icon';
+export { PasswordInputIcon } from './PasswordInputIcon';

package/src/icons/social/AppleMusicIcon.native.tsx

@@ -0,0 +1,44 @@
+import * as React from "react";
+import Svg, { Path, G, Defs, LinearGradient, Stop, ClipPath, Rect } from "react-native-svg";
+
+type Props = {
+  size?: number | string;
+};
+
+const AppleMusicIcon: React.FC<Props> = ({ size = 28 }) => {
+  return (
+    <Svg
+      width={size}
+      height={size}
+      viewBox="0 0 28 28"
+      fill="none"
+    >
+      <G clipPath="url(#am-clip)">
+        <Path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M27.9224 8.73429C27.9224 8.40077 27.9224 8.06726 27.9209 7.73374C27.9193 7.45296 27.9162 7.17219 27.9085 6.89141C27.8922 6.27945 27.8557 5.66283 27.7471 5.05784C27.637 4.44355 27.4563 3.87191 27.1724 3.31346C26.8932 2.7651 26.5286 2.26404 26.0935 1.82892C25.6584 1.3938 25.1566 1.02925 24.6082 0.750028C24.0505 0.46615 23.4789 0.286205 22.8654 0.175291C22.2604 0.0667036 21.643 0.0302493 21.031 0.0139612C20.7502 0.00620499 20.4695 0.00310249 20.1887 0.00155125C19.8552 0 19.5217 0 19.1881 0H8.73429C8.40077 0 8.06726 0 7.73374 0.00155125C7.45296 0.00310249 7.17219 0.00620499 6.89141 0.0139612C6.27945 0.0310249 5.66205 0.0667036 5.05706 0.176066C4.44277 0.286205 3.87191 0.466925 3.31424 0.750803C2.76587 1.03003 2.26404 1.39457 1.82892 1.8297C1.3938 2.26482 1.02925 2.76587 0.750028 3.31424C0.46615 3.87269 0.285429 4.44432 0.175291 5.05861C0.0667036 5.6636 0.0302493 6.281 0.0139612 6.89219C0.00620499 7.17296 0.00310249 7.45374 0.00155125 7.73452C0 8.06726 0 8.40077 0 8.73429V19.1874C0 19.5209 0 19.8544 0.00155125 20.1879C0.00310249 20.4687 0.00620499 20.7495 0.0139612 21.0303C0.0302493 21.6422 0.0667036 22.2588 0.175291 22.8638C0.285429 23.4781 0.46615 24.0497 0.750028 24.6082C1.02925 25.1566 1.3938 25.6576 1.82892 26.0927C2.26404 26.5279 2.76587 26.8924 3.31424 27.1716C3.87191 27.4555 4.44355 27.6355 5.05706 27.7464C5.66205 27.855 6.27945 27.8914 6.89141 27.9077C7.17219 27.9155 7.45296 27.9186 7.73374 27.9201C8.06726 27.9224 8.40077 27.9217 8.73429 27.9217H19.1874C19.5209 27.9217 19.8544 27.9217 20.1879 27.9201C20.4687 27.9186 20.7495 27.9155 21.0303 27.9077C21.6422 27.8914 22.2596 27.855 22.8646 27.7464C23.4789 27.6362 24.0498 27.4555 24.6074 27.1716C25.1558 26.8924 25.6576 26.5279 26.0927 26.0927C26.5279 25.6576 26.8924 25.1566 27.1716 24.6082C27.4555 24.0497 27.6362 23.4781 27.7464 22.8638C27.855 22.2588 27.8914 21.6414 27.9077 21.0303C27.9155 20.7495 27.9186 20.4687 27.9201 20.1879C27.9224 19.8544 27.9217 19.5209 27.9217 19.1874V8.73429H27.9224Z"
+          fill="url(#am-grad)"
+        />
+        <Path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M19.7393 4.26611C19.6719 4.27231 19.0723 4.37857 19.0002 4.39331L10.701 6.06788L10.6979 6.06866C10.4815 6.11442 10.3116 6.1912 10.1806 6.30134C10.0223 6.43397 9.93468 6.62168 9.90133 6.8404C9.89435 6.88694 9.88272 6.98156 9.88272 7.12118C9.88272 7.12118 9.88272 15.6003 9.88272 17.5083C9.88272 17.7511 9.86333 17.9869 9.69889 18.1878C9.53446 18.3887 9.33125 18.4492 9.09313 18.4972C8.91241 18.5337 8.73169 18.5702 8.55097 18.6066C7.86532 18.7447 7.41934 18.8385 7.01524 18.9952C6.62898 19.1449 6.33967 19.3357 6.10931 19.5777C5.65247 20.0562 5.46709 20.7054 5.53069 21.3135C5.58499 21.8324 5.81845 22.3288 6.21945 22.6957C6.49014 22.9439 6.82831 23.1324 7.22698 23.2123C7.64039 23.2952 8.08094 23.2666 8.72471 23.1362C9.06754 23.0672 9.38864 22.9594 9.69424 22.7787C9.99673 22.6003 10.2558 22.3622 10.4582 22.0721C10.6614 21.7812 10.7925 21.4578 10.8647 21.1142C10.9391 20.7597 10.957 20.4394 10.957 20.0857V11.0769C10.957 10.5944 11.0935 10.4672 11.4828 10.3726C11.4828 10.3726 18.3812 8.98112 18.7031 8.9183C19.1522 8.8322 19.3639 8.96018 19.3639 9.43098V15.5809C19.3639 15.8244 19.3616 16.0711 19.1956 16.2728C19.0312 16.4736 18.828 16.5341 18.5899 16.5822C18.4091 16.6187 18.2284 16.6551 18.0477 16.6916C17.3621 16.8297 16.9161 16.9235 16.512 17.0802C16.1257 17.2299 15.8364 17.4207 15.606 17.6627C15.1492 18.1412 14.9475 18.7904 15.0111 19.3985C15.0654 19.9174 15.3152 20.4138 15.7162 20.7807C15.9869 21.0289 16.325 21.2119 16.7237 21.2926C17.1371 21.3756 17.5777 21.3461 18.2214 21.2166C18.5643 21.1475 18.8854 21.0444 19.191 20.8637C19.4935 20.6853 19.7525 20.4472 19.955 20.1571C20.1582 19.8662 20.2893 19.5428 20.3614 19.1992C20.4358 18.8447 20.4389 18.5244 20.4389 18.1707V4.99985C20.4405 4.52206 20.1884 4.22733 19.7393 4.26611Z"
+          fill="white"
+        />
+      </G>
+      <Defs>
+        <LinearGradient id="am-grad" x1="13.9612" y1="27.8142" x2="13.9612" y2="0.601774" gradientUnits="userSpaceOnUse">
+          <Stop stopColor="#FA233B" />
+          <Stop offset="1" stopColor="#FB5C74" />
+        </LinearGradient>
+        <ClipPath id="am-clip">
+          <Rect width="28" height="28" fill="white" />
+        </ClipPath>
+      </Defs>
+    </Svg>
+  );
+};
+
+export { AppleMusicIcon };
+export default AppleMusicIcon;

package/src/icons/social/AppleMusicIcon.web.tsx

@@ -0,0 +1,50 @@
+import * as React from "react";
+
+type Props = {
+  size?: number | string;
+  title?: string;
+  className?: string;
+};
+
+export default function AppleMusicIcon({ size = 28, title = "Apple Music", className }: Props) {
+  const gid = React.useId();
+  const gradId = `am-grad-${gid}`;
+  const clipId = `am-clip-${gid}`;
+
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 28 28"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-label={title}
+      role="img"
+      className={className}
+    >
+      <g clipPath={`url(#${clipId})`}>
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M27.9224 8.73429C27.9224 8.40077 27.9224 8.06726 27.9209 7.73374C27.9193 7.45296 27.9162 7.17219 27.9085 6.89141C27.8922 6.27945 27.8557 5.66283 27.7471 5.05784C27.637 4.44355 27.4563 3.87191 27.1724 3.31346C26.8932 2.7651 26.5286 2.26404 26.0935 1.82892C25.6584 1.3938 25.1566 1.02925 24.6082 0.750028C24.0505 0.46615 23.4789 0.286205 22.8654 0.175291C22.2604 0.0667036 21.643 0.0302493 21.031 0.0139612C20.7502 0.00620499 20.4695 0.00310249 20.1887 0.00155125C19.8552 0 19.5217 0 19.1881 0H8.73429C8.40077 0 8.06726 0 7.73374 0.00155125C7.45296 0.00310249 7.17219 0.00620499 6.89141 0.0139612C6.27945 0.0310249 5.66205 0.0667036 5.05706 0.176066C4.44277 0.286205 3.87191 0.466925 3.31424 0.750803C2.76587 1.03003 2.26404 1.39457 1.82892 1.8297C1.3938 2.26482 1.02925 2.76587 0.750028 3.31424C0.46615 3.87269 0.285429 4.44432 0.175291 5.05861C0.0667036 5.6636 0.0302493 6.281 0.0139612 6.89219C0.00620499 7.17296 0.00310249 7.45374 0.00155125 7.73452C0 8.06726 0 8.40077 0 8.73429V19.1874C0 19.5209 0 19.8544 0.00155125 20.1879C0.00310249 20.4687 0.00620499 20.7495 0.0139612 21.0303C0.0302493 21.6422 0.0667036 22.2588 0.175291 22.8638C0.285429 23.4781 0.46615 24.0497 0.750028 24.6082C1.02925 25.1566 1.3938 25.6576 1.82892 26.0927C2.26404 26.5279 2.76587 26.8924 3.31424 27.1716C3.87191 27.4555 4.44355 27.6355 5.05706 27.7464C5.66205 27.855 6.27945 27.8914 6.89141 27.9077C7.17219 27.9155 7.45296 27.9186 7.73374 27.9201C8.06726 27.9224 8.40077 27.9217 8.73429 27.9217H19.1874C19.5209 27.9217 19.8544 27.9217 20.1879 27.9201C20.4687 27.9186 20.7495 27.9155 21.0303 27.9077C21.6422 27.8914 22.2596 27.855 22.8646 27.7464C23.4789 27.6362 24.0498 27.4555 24.6074 27.1716C25.1558 26.8924 25.6576 26.5279 26.0927 26.0927C26.5279 25.6576 26.8924 25.1566 27.1716 24.6082C27.4555 24.0497 27.6362 23.4781 27.7464 22.8638C27.855 22.2588 27.8914 21.6414 27.9077 21.0303C27.9155 20.7495 27.9186 20.4687 27.9201 20.1879C27.9224 19.8544 27.9217 19.5209 27.9217 19.1874V8.73429H27.9224Z"
+          fill={`url(#${gradId})`}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M19.7393 4.26611C19.6719 4.27231 19.0723 4.37857 19.0002 4.39331L10.701 6.06788L10.6979 6.06866C10.4815 6.11442 10.3116 6.1912 10.1806 6.30134C10.0223 6.43397 9.93468 6.62168 9.90133 6.8404C9.89435 6.88694 9.88272 6.98156 9.88272 7.12118C9.88272 7.12118 9.88272 15.6003 9.88272 17.5083C9.88272 17.7511 9.86333 17.9869 9.69889 18.1878C9.53446 18.3887 9.33125 18.4492 9.09313 18.4972C8.91241 18.5337 8.73169 18.5702 8.55097 18.6066C7.86532 18.7447 7.41934 18.8385 7.01524 18.9952C6.62898 19.1449 6.33967 19.3357 6.10931 19.5777C5.65247 20.0562 5.46709 20.7054 5.53069 21.3135C5.58499 21.8324 5.81845 22.3288 6.21945 22.6957C6.49014 22.9439 6.82831 23.1324 7.22698 23.2123C7.64039 23.2952 8.08094 23.2666 8.72471 23.1362C9.06754 23.0672 9.38864 22.9594 9.69424 22.7787C9.99673 22.6003 10.2558 22.3622 10.4582 22.0721C10.6614 21.7812 10.7925 21.4578 10.8647 21.1142C10.9391 20.7597 10.957 20.4394 10.957 20.0857V11.0769C10.957 10.5944 11.0935 10.4672 11.4828 10.3726C11.4828 10.3726 18.3812 8.98112 18.7031 8.9183C19.1522 8.8322 19.3639 8.96018 19.3639 9.43098V15.5809C19.3639 15.8244 19.3616 16.0711 19.1956 16.2728C19.0312 16.4736 18.828 16.5341 18.5899 16.5822C18.4091 16.6187 18.2284 16.6551 18.0477 16.6916C17.3621 16.8297 16.9161 16.9235 16.512 17.0802C16.1257 17.2299 15.8364 17.4207 15.606 17.6627C15.1492 18.1412 14.9475 18.7904 15.0111 19.3985C15.0654 19.9174 15.3152 20.4138 15.7162 20.7807C15.9869 21.0289 16.325 21.2119 16.7237 21.2926C17.1371 21.3756 17.5777 21.3461 18.2214 21.2166C18.5643 21.1475 18.8854 21.0444 19.191 20.8637C19.4935 20.6853 19.7525 20.4472 19.955 20.1571C20.1582 19.8662 20.2893 19.5428 20.3614 19.1992C20.4358 18.8447 20.4389 18.5244 20.4389 18.1707V4.99985C20.4405 4.52206 20.1884 4.22733 19.7393 4.26611Z"
+          fill="white"
+        />
+      </g>
+      <defs>
+        <linearGradient id={gradId} x1="13.9612" y1="27.8142" x2="13.9612" y2="0.601774" gradientUnits="userSpaceOnUse">
+          <stop stopColor="#FA233B" />
+          <stop offset="1" stopColor="#FB5C74" />
+        </linearGradient>
+        <clipPath id={clipId}>
+          <rect width="28" height="28" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}

package/src/icons/social/AudiomackIcon.native.tsx

@@ -0,0 +1,36 @@
+import React from "react";
+import Svg, { Path, G, Defs, LinearGradient, Stop, ClipPath, Rect } from "react-native-svg";
+
+const AudiomackIcon: React.FC = () => (
+  <Svg
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+    fill="none"
+  >
+    <G clipPath="url(#audiomack-clip)">
+      <Path
+        d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+        fill="#0E0E0E"
+      />
+      <Path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M3.16613 8.66621C3.16613 8.66621 3.43803 8.62088 3.55008 8.73904C3.66225 8.85698 3.5888 9.10098 3.43992 9.1052C3.29105 9.10911 3.15354 9.13685 3.05589 9.03237C2.9583 8.92776 2.98452 8.71778 3.16613 8.66621ZM6.11783 10.3321C6.09162 10.335 6.06395 10.3228 6.03552 10.3024C5.84058 10.0285 5.77023 9.09179 5.68071 9.03606C5.58788 8.9783 5.25179 9.55502 4.58342 9.49305C4.30394 9.46704 4.01952 9.28452 3.85193 9.15807C3.86754 8.94533 3.87027 8.44838 4.28652 8.61C4.5395 8.70813 4.97256 8.97771 5.35296 8.49357C5.77337 7.95824 6.00534 8.11384 6.14448 8.23013C6.28352 8.34652 6.19092 8.95167 6.39828 8.78248C6.60579 8.61334 7.44324 7.56298 7.44324 7.56298C7.44324 7.56298 8.09177 6.90364 8.1911 7.59677C8.29032 8.28981 8.71308 9.05783 8.82519 9.03599C8.93738 9.01415 10.2416 6.34151 10.4286 6.16909C10.6153 5.99662 11.2443 6.01924 11.2143 6.46156C11.1845 6.90398 11.1204 9.6533 11.1204 9.6533C11.1204 9.6533 11.0466 10.4281 11.1668 10.0141C11.2165 9.84241 11.2702 9.6876 11.3371 9.50684C11.6591 8.4678 12.2074 6.69298 12.4806 5.77846C12.5333 5.59463 12.5862 5.4109 12.6395 5.22725V5.22691C12.6532 5.1704 12.6695 5.11457 12.6885 5.05964C12.7113 4.98203 12.7267 4.93081 12.7315 4.91735C12.7438 4.88308 12.778 4.85704 12.826 4.83784C12.8744 4.80715 12.9262 4.8056 12.985 4.80401C13.1366 4.7903 13.3316 4.81036 13.507 4.86061C13.558 4.86278 13.6135 4.87925 13.6662 4.9172L13.6737 4.92206L13.6774 4.92469C13.6884 4.93229 13.7062 4.94748 13.7267 4.97243C13.7273 4.97329 13.7279 4.97432 13.7288 4.97504C13.7373 4.98554 13.7458 4.99794 13.7546 5.01218C13.8525 5.15699 13.9127 5.42405 13.8524 5.89765C13.702 7.07929 13.5855 9.51021 13.5855 9.51021C13.5855 9.51021 13.5624 9.62636 13.804 9.11446C13.8125 9.09655 13.8232 9.08126 13.8331 9.06489C13.9823 8.88546 14.3836 8.78006 14.6618 8.78223C14.7791 8.79656 14.8774 8.82624 14.936 8.86362C15.0459 9.03206 14.981 9.65392 14.981 9.65392C14.7496 9.67556 14.3083 9.80111 14.1519 9.82429C13.9955 9.84758 13.7578 10.8717 13.4275 10.7668C13.0971 10.6622 12.3611 10.1968 12.3611 10.1327C12.3611 10.077 12.4191 9.39678 12.434 9.22118C12.4352 9.20898 12.4361 9.19775 12.437 9.18656L12.4376 9.17952V9.17974C12.4482 9.04146 12.4388 8.98109 12.3754 9.11907C12.3209 9.23778 12.0837 9.99739 11.8194 10.8246C11.7915 10.8969 11.2917 12.4214 11.2261 12.6073C11.148 12.8229 11.0821 12.988 11.0366 13.0732C10.9675 13.1678 10.8744 13.227 10.7442 13.1873C10.4198 13.0884 10.0088 12.6363 10.0049 12.5242C9.99708 11.8915 10.0355 8.48996 9.88331 8.77337C9.72722 9.0641 8.51316 11.0811 8.51316 11.0811C8.49281 11.0846 8.47763 11.084 8.45987 11.0856C8.37386 11.0761 8.24067 11.0481 8.20383 10.9651C8.20182 10.9602 8.19909 10.9558 8.19731 10.9507L8.19054 10.9303C8.17397 10.8747 8.16731 10.8145 8.15276 10.7651C8.09853 10.5803 8.01161 10.3155 7.9203 10.046C7.78055 9.58664 7.63656 9.11673 7.61285 9.06495C7.56651 8.96348 7.49904 9.0062 7.43843 9.06482C7.16747 9.29643 6.59181 10.3193 6.07194 10.3752L6.11783 10.3321Z"
+        fill="url(#audiomack-grad)"
+      />
+    </G>
+    <Defs>
+      <LinearGradient id="audiomack-grad" x1="-2.36665" y1="8.73187" x2="5.82968" y2="19.6041" gradientUnits="userSpaceOnUse">
+        <Stop stopColor="#FFBE00" />
+        <Stop offset="1" stopColor="#E85E0A" />
+      </LinearGradient>
+      <ClipPath id="audiomack-clip">
+        <Rect width="18" height="18" fill="white" />
+      </ClipPath>
+    </Defs>
+  </Svg>
+);
+
+export { AudiomackIcon };
+export default AudiomackIcon;

package/src/icons/social/AudiomackIcon.web.tsx

@@ -0,0 +1,45 @@
+import React from 'react';
+
+/**
+ * AudiomackIcon component renders the Audiomack logo as an SVG.
+ *
+ * @param {React.SVGProps<SVGSVGElement>} props - Standard SVG props, including className for Tailwind styling.
+ * @returns {JSX.Element}
+ */
+const AudiomackIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({ className, ...props }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+    className={className}
+    role="img"
+    aria-label="Audiomack Logo"
+    fill="none"
+    {...props}
+  >
+    <g clipPath="url(#clip0)">
+      <path
+        d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+        fill="#0E0E0E"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M3.16613 8.66621C3.16613 8.66621 3.43803 8.62088 3.55008 8.73904C3.66225 8.85698 3.5888 9.10098 3.43992 9.1052C3.29105 9.10911 3.15354 9.13685 3.05589 9.03237C2.9583 8.92776 2.98452 8.71778 3.16613 8.66621ZM6.11783 10.3321C6.09162 10.335 6.06395 10.3228 6.03552 10.3024C5.84058 10.0285 5.77023 9.09179 5.68071 9.03606C5.58788 8.9783 5.25179 9.55502 4.58342 9.49305C4.30394 9.46704 4.01952 9.28452 3.85193 9.15807C3.86754 8.94533 3.87027 8.44838 4.28652 8.61C4.5395 8.70813 4.97256 8.97771 5.35296 8.49357C5.77337 7.95824 6.00534 8.11384 6.14448 8.23013C6.28352 8.34652 6.19092 8.95167 6.39828 8.78248C6.60579 8.61334 7.44324 7.56298 7.44324 7.56298C7.44324 7.56298 8.09177 6.90364 8.1911 7.59677C8.29032 8.28981 8.71308 9.05783 8.82519 9.03599C8.93738 9.01415 10.2416 6.34151 10.4286 6.16909C10.6153 5.99662 11.2443 6.01924 11.2143 6.46156C11.1845 6.90398 11.1204 9.6533 11.1204 9.6533C11.1204 9.6533 11.0466 10.4281 11.1668 10.0141C11.2165 9.84241 11.2702 9.6876 11.3371 9.50684C11.6591 8.4678 12.2074 6.69298 12.4806 5.77846C12.5333 5.59463 12.5862 5.4109 12.6395 5.22725V5.22691C12.6532 5.1704 12.6695 5.11457 12.6885 5.05964C12.7113 4.98203 12.7267 4.93081 12.7315 4.91735C12.7438 4.88308 12.778 4.85704 12.826 4.83784C12.8744 4.80715 12.9262 4.8056 12.985 4.80401C13.1366 4.7903 13.3316 4.81036 13.507 4.86061C13.558 4.86278 13.6135 4.87925 13.6662 4.9172L13.6737 4.92206L13.6774 4.92469C13.6884 4.93229 13.7062 4.94748 13.7267 4.97243C13.7273 4.97329 13.7279 4.97432 13.7288 4.97504C13.7373 4.98554 13.7458 4.99794 13.7546 5.01218C13.8525 5.15699 13.9127 5.42405 13.8524 5.89765C13.702 7.07929 13.5855 9.51021 13.5855 9.51021C13.5855 9.51021 13.5624 9.62636 13.804 9.11446C13.8125 9.09655 13.8232 9.08126 13.8331 9.06489C13.9823 8.88546 14.3836 8.78006 14.6618 8.78223C14.7791 8.79656 14.8774 8.82624 14.936 8.86362C15.0459 9.03206 14.981 9.65392 14.981 9.65392C14.7496 9.67556 14.3083 9.80111 14.1519 9.82429C13.9955 9.84758 13.7578 10.8717 13.4275 10.7668C13.0971 10.6622 12.3611 10.1968 12.3611 10.1327C12.3611 10.077 12.4191 9.39678 12.434 9.22118C12.4352 9.20898 12.4361 9.19775 12.437 9.18656L12.4376 9.17952V9.17974C12.4482 9.04146 12.4388 8.98109 12.3754 9.11907C12.3209 9.23778 12.0837 9.99739 11.8194 10.8246C11.7915 10.8969 11.2917 12.4214 11.2261 12.6073C11.148 12.8229 11.0821 12.988 11.0366 13.0732C10.9675 13.1678 10.8744 13.227 10.7442 13.1873C10.4198 13.0884 10.0088 12.6363 10.0049 12.5242C9.99708 11.8915 10.0355 8.48996 9.88331 8.77337C9.72722 9.0641 8.51316 11.0811 8.51316 11.0811C8.49281 11.0846 8.47763 11.084 8.45987 11.0856C8.37386 11.0761 8.24067 11.0481 8.20383 10.9651C8.20182 10.9602 8.19909 10.9558 8.19731 10.9507L8.19054 10.9303C8.17397 10.8747 8.16731 10.8145 8.15276 10.7651C8.09853 10.5803 8.01161 10.3155 7.9203 10.046C7.78055 9.58664 7.63656 9.11673 7.61285 9.06495C7.56651 8.96348 7.49904 9.0062 7.43843 9.06482C7.16747 9.29643 6.59181 10.3193 6.07194 10.3752L6.11783 10.3321Z"
+        fill="url(#paint0_linear)"
+      />
+    </g>
+    <defs>
+      <linearGradient id="paint0_linear" x1="-2.36665" y1="8.73187" x2="5.82968" y2="19.6041" gradientUnits="userSpaceOnUse">
+        <stop stopColor="#FFBE00" />
+        <stop offset="1" stopColor="#E85E0A" />
+      </linearGradient>
+      <clipPath id="clip0">
+        <rect width="18" height="18" fill="white" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default AudiomackIcon;

package/src/icons/social/InstagramShortsIcon.native.tsx

@@ -0,0 +1,38 @@
+import React from "react";
+import Svg, { Path, Defs, RadialGradient, Stop } from "react-native-svg";
+
+const InstagramShortsIcon: React.FC = () => (
+  <Svg
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+    fill="none"
+  >
+    <Defs>
+      <RadialGradient
+        id="instagramShortsGradient"
+        cx="0"
+        cy="0"
+        r="1"
+        gradientUnits="userSpaceOnUse"
+        gradientTransform="translate(2.86772 19.3122) rotate(-9.54789) scale(38.0446 23.1323)"
+      >
+        <Stop stopColor="#FED576" />
+        <Stop offset="0.263" stopColor="#F47133" />
+        <Stop offset="0.609" stopColor="#BC3081" />
+        <Stop offset="1" stopColor="#4C63D2" />
+      </RadialGradient>
+    </Defs>
+    <Path
+      d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+      fill="url(#instagramShortsGradient)"
+    />
+    <Path
+      d="M6.00327 3.635L7.78271 6.68727H3.60156V6.43013C3.60156 5.01071 4.643 3.83813 6.00327 3.635ZM11.1256 6.68727H8.37671L6.57671 3.60156H9.32556L11.1256 6.68727ZM14.4016 6.43013V6.68727H11.7196L9.91956 3.60156H11.573C13.1364 3.60156 14.4016 4.86671 14.4016 6.43013ZM3.60156 7.20156V11.573C3.60156 13.1364 4.86671 14.4016 6.43013 14.4016H11.573C13.1364 14.4016 14.4016 13.1364 14.4016 11.573V7.20156H3.60156ZM10.5444 10.8504L8.48985 12.0179C8.14785 12.2133 7.71585 11.9716 7.71585 11.5833V9.24842C7.71585 8.86013 8.14785 8.61842 8.48985 8.81385L10.5444 9.98127C10.8864 10.1741 10.8864 10.6576 10.5444 10.8504Z"
+      fill="#F7F7F7"
+    />
+  </Svg>
+);
+
+export { InstagramShortsIcon };
+export default InstagramShortsIcon;

package/src/icons/social/InstagramShortsIcon.web.tsx

@@ -0,0 +1,47 @@
+import React from 'react';
+
+/**
+ * InstagramShortsIcon component renders the Instagram Shorts (Reels) logo as an SVG.
+ *
+ * @param {React.SVGProps<SVGSVGElement>} props - Standard SVG props, including className for Tailwind styling.
+ * @returns {JSX.Element}
+ */
+const InstagramShortsIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({ className, ...props }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+    className={className}
+    role="img"
+    aria-label="Instagram Shorts Logo"
+    fill="none"
+    {...props}
+  >
+    <defs>
+      <radialGradient
+        id="instagramShortsGradient"
+        cx="0"
+        cy="0"
+        r="1"
+        gradientUnits="userSpaceOnUse"
+        gradientTransform="translate(2.86772 19.3122) rotate(-9.54789) scale(38.0446 23.1323)"
+      >
+        <stop stopColor="#FED576" />
+        <stop offset="0.263" stopColor="#F47133" />
+        <stop offset="0.609" stopColor="#BC3081" />
+        <stop offset="1" stopColor="#4C63D2" />
+      </radialGradient>
+    </defs>
+    <path
+      d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+      fill="url(#instagramShortsGradient)"
+    />
+    <path
+      d="M6.00327 3.635L7.78271 6.68727H3.60156V6.43013C3.60156 5.01071 4.643 3.83813 6.00327 3.635ZM11.1256 6.68727H8.37671L6.57671 3.60156H9.32556L11.1256 6.68727ZM14.4016 6.43013V6.68727H11.7196L9.91956 3.60156H11.573C13.1364 3.60156 14.4016 4.86671 14.4016 6.43013ZM3.60156 7.20156V11.573C3.60156 13.1364 4.86671 14.4016 6.43013 14.4016H11.573C13.1364 14.4016 14.4016 13.1364 14.4016 11.573V7.20156H3.60156ZM10.5444 10.8504L8.48985 12.0179C8.14785 12.2133 7.71585 11.9716 7.71585 11.5833V9.24842C7.71585 8.86013 8.14785 8.61842 8.48985 8.81385L10.5444 9.98127C10.8864 10.1741 10.8864 10.6576 10.5444 10.8504Z"
+      fill="#F7F7F7"
+    />
+  </svg>
+);
+
+export default InstagramShortsIcon;

package/src/icons/social/ShazamIcon.native.tsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Svg, { Path, G, Defs, LinearGradient, Stop, ClipPath, Rect } from "react-native-svg";
+
+const ShazamIcon: React.FC = () => (
+  <Svg
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+  >
+    <Defs>
+      <LinearGradient id="shazamGradient" x1="9.00145" y1="17.9976" x2="9.00145" y2="-4.53053" gradientUnits="userSpaceOnUse">
+        <Stop stopColor="#2255FF" />
+        <Stop offset="1" stopColor="#00AAFF" />
+      </LinearGradient>
+      <ClipPath id="shazamClip">
+        <Rect width="18" height="18" fill="white" />
+      </ClipPath>
+    </Defs>
+    <G clipPath="url(#shazamClip)">
+      <Path
+        d="M0 9.00008C0 4.02951 4.02944 0 9 0C13.9706 0 18 4.02951 18 9.00008C18 13.9706 13.9706 18.0002 9 18.0002C4.02944 18.0002 0 13.9706 0 9.00008Z"
+        fill="url(#shazamGradient)"
+      />
+      <Path
+        d="M13.8204 12.3499C12.9632 13.2874 11.4364 14.7606 11.3561 14.8142C11.16 14.9988 10.9022 15.1039 10.6329 15.1088C10.4252 15.1081 10.2225 15.0455 10.0506 14.929C9.87868 14.8124 9.74542 14.6473 9.6678 14.4547C9.59017 14.2621 9.57172 14.0507 9.6148 13.8476C9.65788 13.6444 9.76054 13.4587 9.90966 13.3142C9.93643 13.2874 11.4632 11.841 12.2668 10.9571C12.6383 10.5379 12.8306 9.98971 12.8025 9.43029C12.7837 9.12975 12.7025 8.83642 12.5642 8.56896C12.4258 8.30149 12.2333 8.06574 11.9989 7.87671C11.3561 7.341 10.1239 7.20708 9.34716 7.9035C8.8918 8.33208 8.3293 8.92135 8.30251 8.94814C8.11425 9.15061 7.85328 9.27 7.57699 9.28005C7.30072 9.29008 7.03176 9.18997 6.8293 9.00171C6.62683 8.81346 6.50745 8.55249 6.4974 8.2762C6.48735 7.99992 6.58747 7.73097 6.77572 7.5285C6.80251 7.50171 7.41858 6.83208 7.9543 6.34993C8.70318 5.70049 9.6586 5.33853 10.6498 5.32872C11.641 5.31891 12.6034 5.66188 13.365 6.29635C13.8073 6.66879 14.1703 7.12623 14.4326 7.64154C14.6949 8.15686 14.851 8.71959 14.8918 9.29635C14.9344 9.85179 14.8612 10.41 14.6768 10.9357C14.4924 11.4613 14.2007 11.9429 13.8204 12.3499ZM7.52572 12.4303C6.54657 12.4378 5.59684 12.0959 4.84716 11.466C4.40485 11.0936 4.04182 10.6361 3.77956 10.1208C3.5173 9.6055 3.36115 9.04278 3.32037 8.466C3.28623 7.91128 3.36343 7.35534 3.54744 6.83092C3.73146 6.30649 4.01854 5.8242 4.3918 5.41243C5.24893 4.47493 6.77572 3.00171 6.85608 2.94814C6.95457 2.85316 7.0708 2.77852 7.19815 2.72847C7.32549 2.67841 7.46143 2.65393 7.59823 2.65642C7.73503 2.65891 7.87 2.68831 7.99545 2.74297C8.12088 2.79762 8.23432 2.87644 8.3293 2.97493C8.42427 3.07342 8.49891 3.18966 8.54896 3.31699C8.59902 3.44433 8.6235 3.58029 8.62102 3.71709C8.61853 3.85389 8.58912 3.98886 8.53447 4.11429C8.47983 4.23973 8.401 4.35316 8.30251 4.44814C8.27572 4.47493 6.74893 5.92135 5.94537 6.80529C5.57388 7.22451 5.38155 7.77265 5.40966 8.33208C5.42847 8.6326 5.50963 8.92594 5.64798 9.19341C5.78632 9.46087 5.97882 9.69661 6.21322 9.88564C6.85608 10.4214 8.08822 10.5553 8.86501 9.85885C9.32037 9.43029 9.88287 8.841 9.90966 8.81421C10.0029 8.71396 10.1149 8.63305 10.2394 8.57611C10.3639 8.51916 10.4984 8.4873 10.6352 8.48232C10.772 8.47734 10.9084 8.49936 11.0367 8.54712C11.165 8.59488 11.2826 8.66743 11.3829 8.76064C11.4831 8.85385 11.564 8.9659 11.621 9.09039C11.6779 9.21487 11.7098 9.34935 11.7148 9.48616C11.7197 9.62296 11.6977 9.7594 11.65 9.88768C11.6022 10.016 11.5297 10.1336 11.4364 10.2339C11.4097 10.2606 10.7936 10.9303 10.2579 11.4124C9.5019 12.0738 8.53014 12.4358 7.52572 12.4303Z"
+        fill="#FFFFFF"
+      />
+    </G>
+  </Svg>
+);
+
+export { ShazamIcon };
+export default ShazamIcon;

package/src/icons/social/ShazamIcon.web.tsx

@@ -0,0 +1,42 @@
+import React from 'react';
+
+/**
+ * ShazamIcon component renders the Shazam logo as an SVG.
+ *
+ * @param {React.SVGProps<SVGSVGElement>} props - Standard SVG props, including className for Tailwind styling.
+ * @returns {JSX.Element}
+ */
+const ShazamIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({ className, ...props }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+    className={className}
+    role="img"
+    aria-label="Shazam Logo"
+    {...props}
+  >
+    <defs>
+      <linearGradient id="shazamGradient" x1="9.00145" y1="17.9976" x2="9.00145" y2="-4.53053" gradientUnits="userSpaceOnUse">
+        <stop stopColor="#2255FF" />
+        <stop offset="1" stopColor="#00AAFF" />
+      </linearGradient>
+      <clipPath id="shazamClip">
+        <rect width="18" height="18" fill="white" />
+      </clipPath>
+    </defs>
+    <g clipPath="url(#shazamClip)">
+      <path
+        d="M0 9.00008C0 4.02951 4.02944 0 9 0C13.9706 0 18 4.02951 18 9.00008C18 13.9706 13.9706 18.0002 9 18.0002C4.02944 18.0002 0 13.9706 0 9.00008Z"
+        fill="url(#shazamGradient)"
+      />
+      <path
+        d="M13.8204 12.3499C12.9632 13.2874 11.4364 14.7606 11.3561 14.8142C11.16 14.9988 10.9022 15.1039 10.6329 15.1088C10.4252 15.1081 10.2225 15.0455 10.0506 14.929C9.87868 14.8124 9.74542 14.6473 9.6678 14.4547C9.59017 14.2621 9.57172 14.0507 9.6148 13.8476C9.65788 13.6444 9.76054 13.4587 9.90966 13.3142C9.93643 13.2874 11.4632 11.841 12.2668 10.9571C12.6383 10.5379 12.8306 9.98971 12.8025 9.43029C12.7837 9.12975 12.7025 8.83642 12.5642 8.56896C12.4258 8.30149 12.2333 8.06574 11.9989 7.87671C11.3561 7.341 10.1239 7.20708 9.34716 7.9035C8.8918 8.33208 8.3293 8.92135 8.30251 8.94814C8.11425 9.15061 7.85328 9.27 7.57699 9.28005C7.30072 9.29008 7.03176 9.18997 6.8293 9.00171C6.62683 8.81346 6.50745 8.55249 6.4974 8.2762C6.48735 7.99992 6.58747 7.73097 6.77572 7.5285C6.80251 7.50171 7.41858 6.83208 7.9543 6.34993C8.70318 5.70049 9.6586 5.33853 10.6498 5.32872C11.641 5.31891 12.6034 5.66188 13.365 6.29635C13.8073 6.66879 14.1703 7.12623 14.4326 7.64154C14.6949 8.15686 14.851 8.71959 14.8918 9.29635C14.9344 9.85179 14.8612 10.41 14.6768 10.9357C14.4924 11.4613 14.2007 11.9429 13.8204 12.3499ZM7.52572 12.4303C6.54657 12.4378 5.59684 12.0959 4.84716 11.466C4.40485 11.0936 4.04182 10.6361 3.77956 10.1208C3.5173 9.6055 3.36115 9.04278 3.32037 8.466C3.28623 7.91128 3.36343 7.35534 3.54744 6.83092C3.73146 6.30649 4.01854 5.8242 4.3918 5.41243C5.24893 4.47493 6.77572 3.00171 6.85608 2.94814C6.95457 2.85316 7.0708 2.77852 7.19815 2.72847C7.32549 2.67841 7.46143 2.65393 7.59823 2.65642C7.73503 2.65891 7.87 2.68831 7.99545 2.74297C8.12088 2.79762 8.23432 2.87644 8.3293 2.97493C8.42427 3.07342 8.49891 3.18966 8.54896 3.31699C8.59902 3.44433 8.6235 3.58029 8.62102 3.71709C8.61853 3.85389 8.58912 3.98886 8.53447 4.11429C8.47983 4.23973 8.401 4.35316 8.30251 4.44814C8.27572 4.47493 6.74893 5.92135 5.94537 6.80529C5.57388 7.22451 5.38155 7.77265 5.40966 8.33208C5.42847 8.6326 5.50963 8.92594 5.64798 9.19341C5.78632 9.46087 5.97882 9.69661 6.21322 9.88564C6.85608 10.4214 8.08822 10.5553 8.86501 9.85885C9.32037 9.43029 9.88287 8.841 9.90966 8.81421C10.0029 8.71396 10.1149 8.63305 10.2394 8.57611C10.3639 8.51916 10.4984 8.4873 10.6352 8.48232C10.772 8.47734 10.9084 8.49936 11.0367 8.54712C11.165 8.59488 11.2826 8.66743 11.3829 8.76064C11.4831 8.85385 11.564 8.9659 11.621 9.09039C11.6779 9.21487 11.7098 9.34935 11.7148 9.48616C11.7197 9.62296 11.6977 9.7594 11.65 9.88768C11.6022 10.016 11.5297 10.1336 11.4364 10.2339C11.4097 10.2606 10.7936 10.9303 10.2579 11.4124C9.5019 12.0738 8.53014 12.4358 7.52572 12.4303Z"
+        fill="#FFFFFF"
+      />
+    </g>
+  </svg>
+);
+
+export default ShazamIcon;

package/src/icons/social/SoundCloudIcon.native.tsx

@@ -0,0 +1,29 @@
+import React from "react";
+import Svg, { Path, G, Defs, ClipPath, Rect } from "react-native-svg";
+
+const SoundCloudIcon: React.FC = () => (
+  <Svg
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+  >
+    <G clipPath="url(#soundcloud-clip)">
+      <Path
+        d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+        fill="#FF5500"
+      />
+      <Path
+        d="M2.07422 9.49046L1.96875 10.2639L2.07422 11.0373C2.07422 11.1076 2.17968 11.1076 2.17968 11.0373L2.28516 10.2639L2.17968 9.49046C2.17968 9.38498 2.07422 9.38498 2.07422 9.49046ZM2.70704 8.99827C2.70704 8.8928 2.60157 8.8928 2.60157 8.99827L2.42578 10.2639L2.56641 11.4944C2.56641 11.5998 2.70704 11.5998 2.70704 11.4944L2.84766 10.2639L2.70704 8.99827ZM4.78125 7.94359L4.67579 10.2639L4.74609 11.6701C4.74609 11.9514 4.99218 11.9514 4.99218 11.6701L5.13282 10.2639L4.99218 7.94359C4.99218 7.7678 4.78125 7.7678 4.78125 7.94359ZM3.69141 8.71702L3.55079 10.2639L3.65625 11.6701C3.65625 11.8811 3.83204 11.8811 3.83204 11.6701L3.97266 10.2639L3.83204 8.71702C3.83204 8.61155 3.69141 8.61155 3.69141 8.71702ZM6.15234 11.6701L6.25782 10.2639L6.15234 7.17014C6.15234 6.95921 5.90625 6.95921 5.90625 7.17014L5.80079 10.2639L5.87109 11.6701C5.87109 11.9514 6.15234 11.9514 6.15234 11.6701ZM8.54296 11.6701L8.61329 10.2639L8.54296 6.67796C8.54296 6.43186 8.19141 6.43186 8.19141 6.67796L8.12109 10.2639L8.19141 11.6701C8.19141 11.9514 8.54296 11.9514 8.54296 11.6701ZM7.34766 11.6701L7.45312 10.2639L7.34766 7.13498C7.34766 6.92405 7.03125 6.92405 7.03125 7.13498L6.96093 10.2639L7.03125 11.6701C7.03125 11.9514 7.34766 11.9514 7.34766 11.6701ZM4.42968 11.6701L4.53516 10.2639L4.42968 8.82248C4.42968 8.71702 4.21875 8.71702 4.21875 8.82248L4.11329 10.2639L4.21875 11.6701C4.21875 11.9162 4.42968 11.9162 4.42968 11.6701ZM3.26954 11.6701L3.41016 10.2639L3.26954 8.75218C3.26954 8.64671 3.12891 8.64671 3.12891 8.75218L2.98829 10.2639L3.12891 11.6701C3.12891 11.8108 3.26954 11.8108 3.26954 11.6701ZM7.62891 7.27561L7.55859 10.2639L7.59375 11.6701C7.59375 11.9514 7.94532 11.9514 7.94532 11.6701L8.01563 10.2639L7.94532 7.27561C7.94532 7.02952 7.62891 7.02952 7.62891 7.27561ZM5.58984 11.6701L5.69532 10.2639L5.58984 7.41623C5.58984 7.2053 5.34375 7.2053 5.34375 7.41623L5.23829 10.2639L5.30859 11.6701C5.30859 11.9514 5.58984 11.9514 5.58984 11.6701ZM6.75 11.6701L6.85546 10.2639L6.75 7.06468C6.75 6.85373 6.46875 6.85373 6.46875 7.06468L6.36329 10.2639L6.46875 11.6701C6.46875 11.9514 6.75 11.9514 6.75 11.6701ZM13.6406 8.54123C13.4648 6.53734 11.3906 5.23655 9.49218 5.97484C9.35157 6.04514 9.31641 6.0803 9.31641 6.18577V11.6701C9.31641 11.7756 9.38672 11.8811 9.49218 11.8811H14.3086C15.2579 11.8811 16.0313 11.1076 16.0313 10.1584C16.0313 8.85764 14.8008 8.15452 13.6406 8.54123ZM8.78907 6.36155L8.68359 10.2639L8.78907 11.6701C8.78907 11.9514 9.14063 11.9514 9.14063 11.6701L9.24609 10.2639L9.14063 6.36155C9.14063 6.11546 8.78907 6.11546 8.78907 6.36155Z"
+        fill="#FFFFFF"
+      />
+    </G>
+    <Defs>
+      <ClipPath id="soundcloud-clip">
+        <Rect width="18" height="18" fill="white" />
+      </ClipPath>
+    </Defs>
+  </Svg>
+);
+
+export { SoundCloudIcon };
+export default SoundCloudIcon;

package/src/icons/social/SoundCloudIcon.web.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+
+/**
+ * SoundCloudIcon component renders the SoundCloud logo as an SVG.
+ *
+ * @param {React.SVGProps<SVGSVGElement>} props - Standard SVG attributes and Tailwind className.
+ * @returns {JSX.Element}
+ */
+const SoundCloudIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({ className, ...props }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+    className={className}
+    role="img"
+    aria-label="SoundCloud Logo"
+    {...props}
+  >
+    <g clipPath="url(#soundcloudClip)">
+      <path
+        d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+        fill="#FF5500"
+      />
+      <path
+        d="M2.07422 9.49046L1.96875 10.2639L2.07422 11.0373C2.07422 11.1076 2.17968 11.1076 2.17968 11.0373L2.28516 10.2639L2.17968 9.49046C2.17968 9.38498 2.07422 9.38498 2.07422 9.49046ZM2.70704 8.99827C2.70704 8.8928 2.60157 8.8928 2.60157 8.99827L2.42578 10.2639L2.56641 11.4944C2.56641 11.5998 2.70704 11.5998 2.70704 11.4944L2.84766 10.2639L2.70704 8.99827ZM4.78125 7.94359L4.67579 10.2639L4.74609 11.6701C4.74609 11.9514 4.99218 11.9514 4.99218 11.6701L5.13282 10.2639L4.99218 7.94359C4.99218 7.7678 4.78125 7.7678 4.78125 7.94359ZM3.69141 8.71702L3.55079 10.2639L3.65625 11.6701C3.65625 11.8811 3.83204 11.8811 3.83204 11.6701L3.97266 10.2639L3.83204 8.71702C3.83204 8.61155 3.69141 8.61155 3.69141 8.71702ZM6.15234 11.6701L6.25782 10.2639L6.15234 7.17014C6.15234 6.95921 5.90625 6.95921 5.90625 7.17014L5.80079 10.2639L5.87109 11.6701C5.87109 11.9514 6.15234 11.9514 6.15234 11.6701ZM8.54296 11.6701L8.61329 10.2639L8.54296 6.67796C8.54296 6.43186 8.19141 6.43186 8.19141 6.67796L8.12109 10.2639L8.19141 11.6701C8.19141 11.9514 8.54296 11.9514 8.54296 11.6701ZM7.34766 11.6701L7.45312 10.2639L7.34766 7.13498C7.34766 6.92405 7.03125 6.92405 7.03125 7.13498L6.96093 10.2639L7.03125 11.6701C7.03125 11.9514 7.34766 11.9514 7.34766 11.6701ZM4.42968 11.6701L4.53516 10.2639L4.42968 8.82248C4.42968 8.71702 4.21875 8.71702 4.21875 8.82248L4.11329 10.2639L4.21875 11.6701C4.21875 11.9162 4.42968 11.9162 4.42968 11.6701ZM3.26954 11.6701L3.41016 10.2639L3.26954 8.75218C3.26954 8.64671 3.12891 8.64671 3.12891 8.75218L2.98829 10.2639L3.12891 11.6701C3.12891 11.8108 3.26954 11.8108 3.26954 11.6701ZM7.62891 7.27561L7.55859 10.2639L7.59375 11.6701C7.59375 11.9514 7.94532 11.9514 7.94532 11.6701L8.01563 10.2639L7.94532 7.27561C7.94532 7.02952 7.62891 7.02952 7.62891 7.27561ZM5.58984 11.6701L5.69532 10.2639L5.58984 7.41623C5.58984 7.2053 5.34375 7.2053 5.34375 7.41623L5.23829 10.2639L5.30859 11.6701C5.30859 11.9514 5.58984 11.9514 5.58984 11.6701ZM6.75 11.6701L6.85546 10.2639L6.75 7.06468C6.75 6.85373 6.46875 6.85373 6.46875 7.06468L6.36329 10.2639L6.46875 11.6701C6.46875 11.9514 6.75 11.9514 6.75 11.6701ZM13.6406 8.54123C13.4648 6.53734 11.3906 5.23655 9.49218 5.97484C9.35157 6.04514 9.31641 6.0803 9.31641 6.18577V11.6701C9.31641 11.7756 9.38672 11.8811 9.49218 11.8811H14.3086C15.2579 11.8811 16.0313 11.1076 16.0313 10.1584C16.0313 8.85764 14.8008 8.15452 13.6406 8.54123ZM8.78907 6.36155L8.68359 10.2639L8.78907 11.6701C8.78907 11.9514 9.14063 11.9514 9.14063 11.6701L9.24609 10.2639L9.14063 6.36155C9.14063 6.11546 8.78907 6.11546 8.78907 6.36155Z"
+        fill="#FFFFFF"
+      />
+    </g>
+    <defs>
+      <clipPath id="soundcloudClip">
+        <rect width="18" height="18" fill="white" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default SoundCloudIcon;

package/src/icons/social/SpotifyIcon.native.tsx

@@ -0,0 +1,31 @@
+import React from "react";
+import Svg, { Path, G, Defs, ClipPath, Rect } from "react-native-svg";
+
+type SpotifyIconProps = { size?: number };
+
+const SpotifyIcon: React.FC<SpotifyIconProps> = ({ size = 18 }) => (
+  <Svg
+    viewBox="0 0 18 18"
+    width={size}
+    height={size}
+  >
+    <G clipPath="url(#spotify-clip)">
+      <Path
+        d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+        fill="#1ED760"
+      />
+      <Path
+        d="M12.2422 12.7508C12.1058 12.7508 12.0128 12.704 11.8855 12.6267C10.6645 11.8928 9.14173 11.5071 7.52653 11.5071C6.62488 11.5071 5.71759 11.6223 4.86906 11.7975C4.73116 11.8273 4.55782 11.8799 4.45369 11.8799C4.13389 11.8799 3.92082 11.6277 3.92082 11.3538C3.92082 11.0026 4.12465 10.827 4.37901 10.7788C5.41956 10.5431 6.45583 10.4085 7.53217 10.4085C9.37554 10.4085 11.0185 10.829 12.4323 11.6708C12.6426 11.7928 12.7658 11.9173 12.7658 12.2272C12.7659 12.5292 12.519 12.7508 12.2422 12.7508ZM13.1601 10.5357C12.9773 10.5357 12.8624 10.4621 12.7378 10.3903C11.3676 9.58242 9.46803 9.04574 7.38829 9.04574C6.32154 9.04574 5.40072 9.19428 4.63867 9.39593C4.47441 9.44102 4.38243 9.48935 4.22862 9.48935C3.86652 9.48935 3.57055 9.19565 3.57055 8.83322C3.57055 8.4774 3.7444 8.23272 4.0945 8.13471C5.04153 7.87607 6.00895 7.67715 7.41639 7.67715C9.62167 7.67715 11.755 8.22269 13.4321 9.21981C13.7133 9.37959 13.8168 9.58344 13.8168 9.88122C13.8168 10.243 13.5263 10.5357 13.1601 10.5357ZM14.2052 7.95944C14.034 7.95944 13.932 7.91793 13.7714 7.83047C12.2468 6.92216 9.87997 6.42206 7.59162 6.42206C6.44915 6.42206 5.28904 6.5376 4.22622 6.82397C4.10376 6.85443 3.94943 6.91535 3.79442 6.91535C3.34497 6.91535 3 6.5621 3 6.11577C3 5.66076 3.28365 5.40552 3.58956 5.31585C4.79061 4.96448 6.13107 4.80078 7.58836 4.80078C10.0622 4.80078 12.6651 5.30633 14.5661 6.41525C14.8224 6.55971 15 6.777 15 7.17552C14.9997 7.63155 14.6307 7.95944 14.2052 7.95944Z"
+        fill="#F7F7F7"
+      />
+    </G>
+    <Defs>
+      <ClipPath id="spotify-clip">
+        <Rect width="18" height="18" fill="white" />
+      </ClipPath>
+    </Defs>
+  </Svg>
+);
+
+export { SpotifyIcon };
+export default SpotifyIcon;

package/src/icons/social/SpotifyIcon.web.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+
+/**
+ * SpotifyIcon component renders the Spotify logo as an SVG.
+ *
+ * @param {React.SVGProps<SVGSVGElement>} props - Standard SVG props, including className for sizing and styling via Tailwind.
+ * @returns {JSX.Element}
+ */
+const SpotifyIcon: React.FC<React.SVGProps<SVGSVGElement> & { size?: number }> = ({ className, size = 18, ...props }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 18 18"
+    width={size}
+    height={size}
+    className={className}
+    role="img"
+    aria-label="Spotify Logo"
+    {...props}
+  >
+    <g clipPath="url(#spotifyClip)">
+      <path
+        d="M0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z"
+        fill="#1ED760"
+      />
+      <path
+        d="M12.2422 12.7508C12.1058 12.7508 12.0128 12.704 11.8855 12.6267C10.6645 11.8928 9.14173 11.5071 7.52653 11.5071C6.62488 11.5071 5.71759 11.6223 4.86906 11.7975C4.73116 11.8273 4.55782 11.8799 4.45369 11.8799C4.13389 11.8799 3.92082 11.6277 3.92082 11.3538C3.92082 11.0026 4.12465 10.827 4.37901 10.7788C5.41956 10.5431 6.45583 10.4085 7.53217 10.4085C9.37554 10.4085 11.0185 10.829 12.4323 11.6708C12.6426 11.7928 12.7658 11.9173 12.7658 12.2272C12.7659 12.5292 12.519 12.7508 12.2422 12.7508ZM13.1601 10.5357C12.9773 10.5357 12.8624 10.4621 12.7378 10.3903C11.3676 9.58242 9.46803 9.04574 7.38829 9.04574C6.32154 9.04574 5.40072 9.19428 4.63867 9.39593C4.47441 9.44102 4.38243 9.48935 4.22862 9.48935C3.86652 9.48935 3.57055 9.19565 3.57055 8.83322C3.57055 8.4774 3.7444 8.23272 4.0945 8.13471C5.04153 7.87607 6.00895 7.67715 7.41639 7.67715C9.62167 7.67715 11.755 8.22269 13.4321 9.21981C13.7133 9.37959 13.8168 9.58344 13.8168 9.88122C13.8168 10.243 13.5263 10.5357 13.1601 10.5357ZM14.2052 7.95944C14.034 7.95944 13.932 7.91793 13.7714 7.83047C12.2468 6.92216 9.87997 6.42206 7.59162 6.42206C6.44915 6.42206 5.28904 6.5376 4.22622 6.82397C4.10376 6.85443 3.94943 6.91535 3.79442 6.91535C3.34497 6.91535 3 6.5621 3 6.11577C3 5.66076 3.28365 5.40552 3.58956 5.31585C4.79061 4.96448 6.13107 4.80078 7.58836 4.80078C10.0622 4.80078 12.6651 5.30633 14.5661 6.41525C14.8224 6.55971 15 6.777 15 7.17552C14.9997 7.63155 14.6307 7.95944 14.2052 7.95944Z"
+        fill="#F7F7F7"
+      />
+    </g>
+    <defs>
+      <clipPath id="spotifyClip">
+        <rect width="18" height="18" fill="white" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default SpotifyIcon;

package/src/icons/social/TiktokIcon.native.tsx

@@ -0,0 +1,38 @@
+import React from "react";
+import Svg, { Path } from "react-native-svg";
+
+const TiktokIcon: React.FC = () => (
+  <Svg
+    viewBox="0 0 18 18"
+    width="18"
+    height="18"
+  >
+    <Path
+      d="M0 9.00008C0 4.02951 4.02944 0 9 0C13.9706 0 18 4.02951 18 9.00008C18 13.9706 13.9706 18.0002 9 18.0002C4.02944 18.0002 0 13.9706 0 9.00008Z"
+      fill="black"
+    />
+    <Path
+      d="M4.16016 13.2726L4.19857 13.3831C4.19331 13.371 4.1791 13.3326 4.16016 13.2726ZM5.7183 10.7541C5.78775 10.1563 6.02298 9.8227 6.465 9.47908C7.09857 9.01548 7.88895 9.27753 7.88895 9.27753V7.7194C8.08102 7.71466 8.2731 7.72677 8.46253 7.75518V9.76008C8.46253 9.76008 7.67268 9.49855 7.03858 9.96162C6.59656 10.3047 6.36133 10.6389 6.29187 11.2366C6.28924 11.5608 6.34713 11.986 6.61603 12.3507C6.54867 12.3149 6.48132 12.2738 6.41185 12.2281C5.82354 11.815 5.71566 11.1935 5.7183 10.7541ZM11.7298 4.83834C11.2952 4.34158 11.1294 3.83694 11.0694 3.48438H11.6167C11.6167 3.48438 11.5088 4.41105 12.3034 5.32089L12.3155 5.33298C12.0998 5.19354 11.903 5.02567 11.7298 4.83834ZM14.3683 6.25018V8.21404C14.3683 8.21404 13.6695 8.18511 13.1512 8.04828C12.4287 7.85622 11.9651 7.561 11.9651 7.561C11.9651 7.561 11.6435 7.34998 11.6193 7.33525V11.3929C11.6193 11.6187 11.5593 12.1828 11.3794 12.6532C11.1442 13.2679 10.779 13.6736 10.7121 13.7551C10.7121 13.7551 10.268 14.3024 9.48762 14.6697C8.78406 15.0012 8.16469 14.9939 7.97998 15.0012C7.97998 15.0012 6.91176 15.0444 5.94877 14.394C5.73987 14.2498 5.54569 14.0867 5.36784 13.9067L5.37256 13.9114C6.33555 14.5645 7.40377 14.5187 7.40377 14.5187C7.58848 14.5113 8.20785 14.5187 8.91141 14.1872C9.69178 13.8199 10.1359 13.2726 10.1359 13.2726C10.2033 13.191 10.5679 12.7853 10.8032 12.1707C10.9831 11.7003 11.0431 11.1361 11.0431 10.9104V6.85534C11.0694 6.86955 11.3889 7.08109 11.3889 7.08109C11.3889 7.08109 11.8524 7.37629 12.5749 7.56837C13.0933 7.70518 13.7921 7.73413 13.7921 7.73413V6.19494C14.0326 6.25018 14.2362 6.26439 14.3683 6.25018Z"
+      fill="#EE1D52"
+    />
+    <Path
+      d="M13.7924 6.1923V7.73149C13.7924 7.73149 13.0936 7.70256 12.5753 7.56574C11.8528 7.37367 11.3892 7.07845 11.3892 7.07845C11.3892 7.07845 11.0676 6.86745 11.0434 6.85272V10.9104C11.0434 11.1361 10.9834 11.7003 10.8035 12.1707C10.5683 12.7853 10.2031 13.191 10.1362 13.2726C10.1362 13.2726 9.69209 13.8199 8.91172 14.1872C8.20816 14.5187 7.58879 14.5113 7.40408 14.5187C7.40408 14.5187 6.33586 14.5618 5.37287 13.9114L5.36815 13.9067C5.26711 13.8036 5.17133 13.6952 5.0824 13.5825C4.77509 13.191 4.58776 12.7301 4.53986 12.598V12.5954C4.46305 12.3675 4.30465 11.815 4.32622 11.2845C4.36463 10.3458 4.68142 9.76744 4.76561 9.62326C4.98664 9.22965 5.27711 8.87655 5.61809 8.58135C5.92067 8.32665 6.26377 8.12301 6.63107 7.98093C7.02941 7.81306 7.4567 7.72413 7.88926 7.71676V9.2749C7.88926 9.2749 7.0994 9.01338 6.46531 9.47644C6.02381 9.81954 5.78806 10.1537 5.71861 10.7515C5.71597 11.1909 5.82437 11.8129 6.41479 12.2281C6.48425 12.2738 6.55162 12.3144 6.61897 12.3507C6.72211 12.4901 6.84682 12.6122 6.99101 12.7132C7.56985 13.0947 8.0524 13.1216 8.67175 12.8743C9.08483 12.7085 9.39425 12.3365 9.53843 11.9213C9.62948 11.6618 9.62737 11.4024 9.62737 11.1335V3.48438H11.0682C11.1281 3.83746 11.2913 4.34158 11.7286 4.83834C11.9038 5.02567 12.1006 5.19354 12.3143 5.33298C12.3769 5.40244 12.701 5.7387 13.1183 5.94762C13.3314 6.05548 13.5598 6.13705 13.7924 6.1923Z"
+      fill="#FFFFFF"
+    />
+    <Path
+      d="M3.96875 12.1211L4.00452 12.2242C3.9998 12.2127 3.98558 12.1764 3.96875 12.1211Z"
+      fill="#69C9D0"
+    />
+    <Path
+      d="M6.6314 7.98073C6.26147 8.12228 5.92048 8.32646 5.61842 8.58115C5.27533 8.87636 4.98695 9.23156 4.76594 9.62571C4.68175 9.76988 4.36496 10.3461 4.32655 11.287C4.30498 11.82 4.466 12.3699 4.54019 12.5978V12.6004C4.58809 12.7299 4.77542 13.1935 5.08273 13.585C5.17166 13.6976 5.26744 13.806 5.36846 13.9091C5.04169 13.6834 4.75384 13.4124 4.50652 13.1024C4.20184 12.7157 4.0145 12.2573 3.9661 12.1226V12.1179C3.88927 11.89 3.72824 11.3375 3.75245 10.8044C3.79087 9.86566 4.10764 9.28733 4.19183 9.14315C4.41286 8.74954 4.70069 8.39381 5.04431 8.09861C5.34689 7.84391 5.68999 7.64027 6.05729 7.49819C6.28778 7.40242 6.52774 7.33243 6.77296 7.28717C7.14289 7.22245 7.51966 7.21771 7.8917 7.27033V7.7171C7.45757 7.72394 7.03027 7.81234 6.6314 7.98073Z"
+      fill="#69C9D0"
+    />
+    <Path
+      d="M11.0703 3.48255H9.62949V11.1317C9.62949 11.4006 9.62949 11.66 9.54057 11.9194C9.39428 12.3325 9.08433 12.7067 8.67389 12.8724C8.05452 13.1218 7.56935 13.0934 6.99314 12.7114C6.84894 12.613 6.72423 12.4904 6.62109 12.3515C7.11311 12.613 7.5525 12.6083 8.09768 12.3899C8.51075 12.2241 8.82017 11.8494 8.96436 11.4369C9.0554 11.1775 9.05328 10.918 9.05328 10.6491V3H11.0435C11.0419 3 11.0203 3.18943 11.0703 3.48255ZM13.793 5.76582V6.19099C13.5598 6.13575 13.332 6.05418 13.1183 5.94632C12.7032 5.74004 12.379 5.40114 12.3143 5.33169C12.3885 5.37957 12.4632 5.42272 12.5421 5.46376C13.051 5.7153 13.5483 5.79213 13.793 5.76582Z"
+      fill="#69C9D0"
+    />
+  </Svg>
+);
+
+export { TiktokIcon };
+export default TiktokIcon;