add external link UX: icons, rel attributes, screen reader labels

New external_link component in core_components handles target="_blank",
rel="noopener noreferrer", external-link icon, and sr-only "(opens in
new tab)" text. Migrated admin providers form, settings (Stripe),
order tracking, onboarding setup links to use it. Fixed rel="noopener"
to "noopener noreferrer" on remaining links (email settings, product
show, core_components card radio). Added sr-only text to shop social
link cards and aria-label to page renderer tracking link.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

lib/berrypod_web/live/admin/email_settings.ex

@@ -272,8 +272,9 @@ defmodule BerrypodWeb.Admin.EmailSettings do
                     :if={adapter.url}
                     href={adapter.url}
                     target="_blank"
-                    rel="noopener"
+                    rel="noopener noreferrer"
                     class="admin-link-subtle admin-adapter-link"
+                    aria-label={adapter.name <> " website (opens in new tab)"}
                   >
                     &nearr;
                   </a>

lib/berrypod_web/live/admin/order_show.ex

@@ -134,15 +134,13 @@ defmodule BerrypodWeb.Admin.OrderShow do
         >
           <span class="admin-text-secondary"><.icon name="hero-truck-mini" class="size-4" /></span>
           <span class="admin-text-medium">{@order.tracking_number}</span>
-          <a
+          <.external_link
             :if={@order.tracking_url not in [nil, ""]}
             href={@order.tracking_url}
-            target="_blank"
-            rel="noopener"
             class="admin-link"
           >
-            Track shipment &rarr;
-          </a>
+            Track shipment
+          </.external_link>
         </div>
         <.order_timeline entries={@timeline} />
       </div>

lib/berrypod_web/live/admin/product_show.ex

@@ -102,11 +102,12 @@ defmodule BerrypodWeb.Admin.ProductShow do
           :if={provider_edit_url(@product)}
           href={provider_edit_url(@product)}
           target="_blank"
-          rel="noopener"
+          rel="noopener noreferrer"
           class="admin-btn admin-btn-ghost admin-btn-sm"
         >
           Edit on {provider_label(@product)}
           <.icon name="hero-arrow-top-right-on-square-mini" class="size-4" />
+          <span class="sr-only">(opens in new tab)</span>
         </.link>
         <.link
           navigate={~p"/products/#{@product.slug}"}

lib/berrypod_web/live/admin/providers/form.html.heex

@@ -15,10 +15,10 @@
       <p class="admin-callout-title">Get your API key from {@provider.name}:</p>
       <ol class="admin-callout-list">
         <li>
-          <a href={@provider.login_url} target="_blank" rel="noopener" class="admin-link">
+          <.external_link href={@provider.login_url} class="admin-link">
             Log in to {@provider.name}
-          </a>
-          (or <a href={@provider.signup_url} target="_blank" rel="noopener" class="admin-link">create a free account</a>)
+          </.external_link>
+          (or <.external_link href={@provider.signup_url} class="admin-link">create a free account</.external_link>)
         </li>
         <li :for={step <- @provider.setup_steps}>
           {raw(step)}

lib/berrypod_web/live/admin/settings.ex

@@ -592,14 +592,9 @@ defmodule BerrypodWeb.Admin.Settings do
       <p class="admin-section-desc admin-section-desc-flush">
         To accept payments, connect your Stripe account by entering your secret key.
         You can find it in your
-        <a
-          href="https://dashboard.stripe.com/apikeys"
-          target="_blank"
-          rel="noopener"
-          class="admin-link"
-        >
+        <.external_link href="https://dashboard.stripe.com/apikeys" class="admin-link">
           Stripe dashboard
-        </a>
+        </.external_link>
         under Developers &rarr; API keys.
       </p>