From c26ebf007ab661d25e7df2abef184691528e108d Mon Sep 17 00:00:00 2001
From: Wesley B <62723358+wesleyboar@users.noreply.github.com>
Date: Wed, 14 Sep 2022 08:58:47 -0500
Subject: [PATCH] feat(trumps): u-mailto-text-replace (for ecep 214) (#44)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat(trumps): ecep-214 u-mailto-text-replace

To replace text of mailto links with text from data attributes.
Lets us protect mailto links from spam by adding false href attribute.

https://github.com/TACC/Core-CMS/pull/546

* fix(trumps): ecep-214 u-mailto-… class in hbs

* feat(tools): ecep-214 x-mailto-… from u-mailto-…
---
 .../_imports/tools/x-mailto-text-replace.css  | 18 +++++++++++++++++
 .../_imports/trumps/u-mailto-text-replace.css |  7 +++++++
 .../u-mailto-text-replace.config.yml          |  7 +++++++
 .../u-mailto-text-replace.hbs                 | 20 +++++++++++++++++++
 4 files changed, 52 insertions(+)
 create mode 100644 src/lib/_imports/tools/x-mailto-text-replace.css
 create mode 100644 src/lib/_imports/trumps/u-mailto-text-replace.css
 create mode 100644 src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.config.yml
 create mode 100644 src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.hbs

diff --git a/src/lib/_imports/tools/x-mailto-text-replace.css b/src/lib/_imports/tools/x-mailto-text-replace.css
new file mode 100644
index 000000000..2e56ae9c0
--- /dev/null
+++ b/src/lib/_imports/tools/x-mailto-text-replace.css
@@ -0,0 +1,18 @@
+/*
+Mailto Link Text Replacement
+
+Replace mailto link rendered text with virtual text from data-attributes
+
+Styleguide Tools.ExtendsAndMixins.MailtoTextReplace
+*/
+
+%x-mailto-text-replace {
+    visibility: hidden;
+    font-size: 0;
+}
+%x-mailto-text-replace::before {
+    display: inline;
+    content: attr(data-user) "@" attr(data-domain);
+    font-size: initial;
+    visibility: visible;
+}
diff --git a/src/lib/_imports/trumps/u-mailto-text-replace.css b/src/lib/_imports/trumps/u-mailto-text-replace.css
new file mode 100644
index 000000000..58b26fc3f
--- /dev/null
+++ b/src/lib/_imports/trumps/u-mailto-text-replace.css
@@ -0,0 +1,7 @@
+/* Create utility class from `x-mailto-text-replace` */
+
+@import url("@tacc/core-styles/src/lib/_imports/tools/x-mailto-text-replace.css");
+
+.u-mailto-text-replace[data-user][data-domain] {
+    @extend %x-mailto-text-replace;
+}
diff --git a/src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.config.yml b/src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.config.yml
new file mode 100644
index 000000000..be7f5a988
--- /dev/null
+++ b/src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.config.yml
@@ -0,0 +1,7 @@
+label: Mailto Link Text Replacement
+notes: |-
+  Replaces the display text of an `<a href="mailto:…" data-user="bob" data-domain="">` link with the e-mail address constructed from the `data-user` and `data-domain` attributes.
+
+  This can be used to render an accurate e-mail that will not be recognized by a generic web scraper. The default display text should be an inaccurate e-mail address.
+
+  _To make sure link is accessible if CSS does not load, make it obvious to humans what part of an e-mail is inaccurate, e.g. `__REMOVE_THIS__`._
diff --git a/src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.hbs b/src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.hbs
new file mode 100644
index 000000000..5bf9daa37
--- /dev/null
+++ b/src/lib/_imports/trumps/u-mailto-text-replace/u-mailto-text-replace.hbs
@@ -0,0 +1,20 @@
+<dl>
+  <dt>No Attributes (thus no effect)</dt>
+  <dd>
+    <a
+      href="mailto:__REMOVE_THIS__someone@any.domain.ext"
+      class="u-mailto-text-replace">
+      __REMOVE_THIS__someone@any.domain.ext
+    </a>
+  </dt>
+
+  <dt>Has Attributes (<code>data-user</code>, <code>data-domain</code>)</dt>
+  <dd>
+    <a
+      href="mailto:__REMOVE_THIS__someone@any.domain.ext"
+      data-domain="any.domain.ext" data-user="someone"
+      class="u-mailto-text-replace">
+      __REMOVE_THIS__someone@any.domain.ext
+    </a>
+  </dt>
+</dl>