@salesforcedevs/dx-components 0.0.0

package/src/modules/dx/socials/socials.ts

@@ -0,0 +1,81 @@
+import { LightningElement, api } from "lwc";
+import { normalizeToArray } from "dxUtils/normalizers";
+
+type Icon = { name: string; symbol: string; baseShareUrl: string };
+
+const URL_TOKEN = "{url}";
+const TEXT_TOKEN = "{text}";
+
+const SOCIAL_ICONS: Array<Icon> = [
+    {
+        name: "Facebook",
+        symbol: "facebook-f",
+        baseShareUrl: `https://www.facebook.com/sharer/sharer.php?u=${URL_TOKEN}`
+    },
+    {
+        name: "Twitter",
+        symbol: "twitter",
+        baseShareUrl: `https://twitter.com/intent/tweet?url=${URL_TOKEN}&text=${TEXT_TOKEN}`
+    },
+    {
+        name: "Linkedin",
+        symbol: "linkedin-in",
+        baseShareUrl: `http://www.linkedin.com/sharing/share-offsite/?url=${URL_TOKEN}`
+    }
+];
+
+const SPRITE_NAME = "brand";
+
+const VALID_TARGETS = ["_self", "_blank", "_parent", "_top", "framename"];
+
+export default class Socials extends LightningElement {
+    private _linksTarget: string = "_blank";
+    private _details: Array<string> = [];
+
+    @api
+    get details() {
+        return this._details;
+    }
+
+    set details(value) {
+        this._details = normalizeToArray(value, "|") as Array<string>;
+    }
+
+    @api
+    get linksTarget(): string {
+        return this._linksTarget;
+    }
+
+    set linksTarget(value: string) {
+        if (value && !VALID_TARGETS.includes(value)) {
+            console.error(
+                `Invalid links target, valid options are: ${VALID_TARGETS.join(
+                    ", "
+                )}`
+            );
+            return;
+        }
+        this._linksTarget = value;
+    }
+
+    get socials() {
+        const url = encodeURIComponent(document.location.href);
+        const text = encodeURIComponent(document.title);
+        return SOCIAL_ICONS.map(({ baseShareUrl, ...value }: Icon) => {
+            return {
+                ...value,
+                href: baseShareUrl
+                    .replace(URL_TOKEN, url)
+                    .replace(TEXT_TOKEN, text)
+            };
+        });
+    }
+
+    get spriteName() {
+        return SPRITE_NAME;
+    }
+
+    get hasDetails() {
+        return this.details && this.details.length > 0;
+    }
+}